IE6 float 异常 消失
Posted on : 18-09-2008 | By : leakon | In : 原创
4
IE6 浏览器对 float 属性的元素显示不太正常，经常遇到的情况是，打开页面，发现某个区域的内容是空的，什么都不显示，但鼠标移动到那个区域，或者附近的一些区域时，那个空的区域立刻显示出原有的内容。
另一个 case 可以称之为“鬼影”，现象是，某串文字，会在 2 个位置同时显示，如果有 hightlight 效果，那么任凭你把光标放到二者任意一个上面，另一串文字也会立刻高亮。
以前对这个问题很抓狂，也没有总结出一个很好的解决方法。
今天又碰到类似的问题，查了一下 Google，有人给出一个结论，当某个元素有 float 属性时，再给他添加 padding 或 margin 等属性，在 IE6 下可能会出现显示问题。
具体的解决方法我总结一下会发布到 Blog 上。
这篇文字算是一个 bug 记录吧。
详细请查阅ie下的layout
简单的加个zoom:1;解决
http://www.leakon.com/archives/199
我在上面这个新日志里写了解决方法，我总结的问题原因就是外层容器没有足够的空间容纳内层 float。
按照你的说法，我联想到，是不是现代浏览器遇到外层容器空间不足的时候都会重新计算一下内层 float 实际占用的空间，而只有 IE6 不会重新计算。
当给 IE6 的容器添加了 zoom 属性后，IE6 才会注意到这个问题？我看了手册，zoom 是对元素的尺寸进行调整，应该也算是容器体积的问题。
还有，谢谢你的回复，给我很大启发~~
外层容器空间不足是另外一个问题，现在来看这个问题的原因就是IE6的layout渲染方式，某些css属性会引起layout的渲染bug，比如float，原因是没有激活外层容器的layout，另外有些属性可以激活layout，比如width，height，background，zoom等，所以一般选择使用zoom:1;来做这个不会影响到其他效果的属性。
google一下IE，layout，会有比较详细的认识。
PS：你的这个皮肤太漂亮了，非常喜欢，呵呵
http://www.skinpress.com/
我的皮肤是从上面这个网站找的，都很漂亮~~