The use of the Zoom property is not known in CSS (ie private properties)

In fact, the Zoom property is the exclusive properties of IE browser, Firefox and other browsers do not support. It can set or retrieve the scale of an object. In addition, it has other small functions, such as triggering IE's Haslayout property, clearing the float, clearing the margin overlap, and so on.

How to use zoom:

Zoom:normal | Number

Normal: Default value. Use the actual size of the object

Number: Percent | Unsigned floating-point real number. A floating-point real value of 1.0 or a percentage of 100% is equivalent to the normal value of this property in the vernacular, zoom: The number that follows is the magnification multiplier, which can be a value or a percentage. such as: zoom:1,zoom:120%. This property only works in IE, so it is seldom used for its actual use, and most often used to clear the float, such as:

Copy CodeThe code is as follows:
. border{
border:1px solid #CCC;
padding:2px;
Overflow:hidden;
_zoom:1;
}

_zoom is the part of the CSS Hack Secondary school that works for IE6. The IE6 browser executes zoom:1 to represent the scale of the object, but here
Overflow:hidden, and _zoom:1, are used to clean border internal floats.

Similarly, the same method can be used to clear the margin property in IE browser overlap problem.

The role of zoom:1 in CSS

Compatible with IE6, IE7, IE8 Browser, often encounter some problems, you can use the zoom:1 to solve, has the following role:
Trigger the haslayout of IE browser
Solve the floating, margin overlap and other problems under IE.
For example, this site uses Div to do a row of two columns of display, HTML code:

Copy CodeThe code is as follows:
<div class= "H_mainbox" >
<ul class= "Mainlist" >
<li><a href= "#" style= "color: #0000FF" target= "_blank" >css Library bar </a></li>
<li><a href= "#" style= "color: #0000FF" target= "_blank" > Original </a></li>
</ul>
</div>

CSS code:

Copy CodeThe code is as follows:
. h_mainbox {border:1px solid #dadada; padding:4px 15px; Background:url (.. /mainbox_bg.gif) 0 1px repeat-x; margin-bottom:6px; Overflow:hidden}
. h_mainbox h2 {font-size:12px; height:30px; line-height:30px; border-bottom:1px solid #ccc; color: #555;}
. H_mainbox H2 span {float:right; font-weight:normal;}
. h_mainbox ul {padding:6px 0px; background: #fff;}
. mainlist {overflow:auto; zoom:1;}
. h_mainbox li {width:268px; float:left; height:24px; overflow:hidden; Background:url (...) /icon3.gif) 0 6px no-repeat; padding:0px 5px 0px 18px; line-height:200%;}

Mainlist inside of the zoom:1 can be in IE6, IE7, IE8 normal display effect.

The role of zoom in CSS

1, check whether the label of the page is closed
Do not underestimate this, perhaps the two days you have not solved the CSS BUG problem, but only from here. After all, page templates are generally nested by development, and they are prone to make such problems.
Quick tip: You can use Dreamweaver to open file inspection, generally no closed tags, yellow background highlighting.

2. Style Exclusion method
Some complex pages may be loaded with N external chain CSS files, then delete the CSS file, find the specific CSS file triggered by the BUG, narrow the scope of the lock.

For the problem of the CSS style file that was just locked, row by line delete the specific style definition, navigate to the specific trigger style definition, even the specific trigger style properties.

3. Module Confirmation method
Sometimes we can also start from the HTML element of the page. Delete the different HTML modules in the page to find the HTML module that triggered the problem.

4, check whether to clear floating
In fact, there are a lot of CSS BUG problems because there is no clear floating caused. It is necessary to develop a good habit of clearing floating, and it is recommended to use the method of clearing floating without extra HTML tags (try to avoid using overflow:hidden;zoom:1 similar method to clear the float, there are too many restrictions).

5, check whether the IE trigger Haslayout
Many of the complex CSS bugs under IE are closely related to IE's unique haslayout. Familiarity and understanding of haslayout can do more with complex CSS bugs. It is recommended to read the OLD9 translation of "On Have layout" (if you cannot climb through the great GFW, you can read the blue reprint)
Quick tip: If the debug tool that triggered the Haslayout,ie, IE Developer Toolbar in the properties will show a haslayout value of-1.

6, Border background debugging method
So the name Incredibles is to set a prominent border or background (generally black or red), for debugging. This method is one of the most common ways to debug a CSS bug and still applies to complex bugs. Affordable also environmentally friendly ^ ^
Finally, I want to emphasize that the formation of good writing habits, reduce the extra tags, as far as possible semantics, conform to the standard, in fact, we can reduce a lot of extra complex CSS bugs, more often we are ourselves to create a problem. Hope you stay away from bugs, life is getting better.

The use of the Zoom property is not known in CSS (ie private properties)