标准参考
根据W3C CSS2.1规范第8.3节中的描述，边距属性设置了一个框的边距区的宽度。'margin' 缩写属性设置所有四边的边距，而其它的边距属性（ 'margin-top' ，'margin-right' ， 'margin-bottom' 及 'margin-left' ）只设置它们代表的那一边的边距。
在实际情况中，当给一个块级元素设置了负值的 'margin' ，如果该元素的父容器 'overflow' 为 'visible' （ 'overflow' 的默认值就是 'visible' ），这个块级元素可能会由于负值的 'margin' 而使其父容器无法全容纳其自身，其会部分“溢出”父容器并在父容器之外被渲染。
实际情况
- 在 IE6 IE7(Q) IE8(Q) 下，由于负值的 'margin' 导致子元素 DIV 超出其父容器部分，均被父元素隐藏，而其 'margin-bottom' 由于没有超出父容器则被显示出来。
- 在 IE7(S) 下情况比较特殊， 'margin-top' 与 'margin-right' 与 IE6 中一样，超出父容器的部分被父容器隐藏。而 'margin-bottom' 虽然并没有因为其负值而超出父容器，但浏览器却将子元素 DIV 的内部裁去了5px。而 'margin-left' 则没有因为负值的影响而被父容器隐藏，反而显示了出来。
- 在 IE8(S) Firefox Chrome Safari Opera 下，浏览器按照 W3C 的规范对代码进行解释，为我们预期的效果。
解决方法
在确保元素的容器触发 hasLayout 的前提下，为该元素同时设置 'position:relative' 和 'zoom:1'。
首先需要保证容器在IE中触发 hasLayout 属性，可以通过zoom:1实现。
在 IE7(S) 中，当使设置了负值 'margin' 的元素的 hasLayout 属性为 'true' ，即触发该元素的 hasLayout 特性后，此 Bug 现象消失，例如为该元素设置宽度或高度，或者在完全不影响该元素盒模型的情况下使用 zoom:1 来触发 hasLayout 从而消除此 Bug 。
在 IE6 IE7(Q) IE8(Q) 中，仅仅触发 hasLayout 特性并不一定能消除此 Bug ，同时还需要为该元素设置 'position:relative'，即在完全不影响该元素盒模型的情况下使用 zoom:1 'position:relative' 。