ie六、7 margin负值部分没法看到的解决方法

ie六、7下，若元素设置margin值为负值，则margin负值区域会有一部分会离奇的消失，没法在页面上看到(至关于父元素设置了overflow:hidden后，子元素超出父元素部分就会被砍掉的效果同样)

问题重现代码：

 

<style>
*{margin: 0;padding: 0;}
body{padding: 200px;}
</style>
<div style="width:200px;height:200px;background:#f00;"><div style="margin:0 -20px;background:#080;">带margin负值的元素</div></div>

解决问题后的代码：

<style>
*{margin: 0;padding: 0;}
body{padding: 200px;}
</style>
<div style="width:200px;height:200px;background:#f00;"><div style="margin:0 -20px;background:#080;*zoom:1;_position:relative;">带margin负值的元素</div></div>

复制上面2段代码，分别在ie六、7上运行，可看到“解决问题后的代码”在页面上的展现效果已同其它浏览器效果同样了：带margin负值的元素,负值部分能彻底显示出来了！！

对比上面2段代码，发现就只给带margin值为负值的元素加了“*zoom:1;_position:relative;”！

我的理解：加了zoom:1属性触发ie7的hasLayout属性,ie7下margin负值可见，但ie6仍坚持隐藏负值部分，需添加position:relative,添加该属性应该是提升了元素层级(z-index)，所以该子元素超出父元素部分就能再次重现了！

不少时候，为解决ie6/7对带margin负值的元素渲染错误致使的页面显示问题，咱们还须要在父元素中触发layout，在父元素上加相似*zoom:1  这样触发layout的属性！