206
The Ultimate CSS Reference
non-positioned or floated elements, a z-index only takes effect when a position is set to relative for the elements, as a z-index can be applied only to positioned elements. Negative margins on floats are handled differently and the details are covered in Floating and Clearing (p. 180). When you use the value auto, you’re allowing the browser to calculate the margins for you automatically. In most cases, the calculated value will default either to zero or to the distance required to reach the parent element’s edge. In the case of a block element that has a specified width, left and right margins to which a value of auto is applied will be set to be equal. This will effectively center the element in the available space. If margins are over-constrained—that is, the total of their specified dimensions is greater than the available content space—the browser will reset one of the margins to auto to overcome the problem. Vertical margins will have no effect on non-replaced (p. 175) inline elements.
Compatibility 5.5
Internet Explorer 6.0 7.0
Buggy
Buggy
Buggy
1.0
Firefox 1.5
2.0
1.3
Safari 2.0
3.0
Opera 9.2
Full
Full
Full
Full
Full
Full
Full
Internet Explorer version 6 in some instances incorrectly bases vertical margin percentage values on the width of the body element, rather than the containing block. Internet Explorer for Windows versions up to and including 7 differ in their handling of margin collapse from the CSS2.1 specifications. See Collapsing Margins (p. 148) for a detailed analysis. Internet Explorer for Windows versions up to and including 7 don’t support the value inherit.