IE6 Peekaboo(躲躲猫) Bug

核心提示：IE6 Peekaboo(躲躲猫) BugPeekaboo本意就是“躲躲猫”游戏(捉迷藏)，这个BUG也是这样，IE6 Peekaboo(躲躲猫) Bug，让你的页面内容时隐时现， 关于这个BUG的原文在这里：http://www.positioniseverything.net/explorer/peekaboo.h

IE6 Peekaboo(躲躲猫) BugPeekaboo本意就是“躲躲猫”游戏(捉迷藏)，这个BUG也是这样，让你的页面内容时隐时现。 关于这个BUG的原文在这里：http://www.positioniseverything.net/explorer/peekaboo.html里面使用了很多辅助元素来形象的说明和演示这个BUG，如果你英文不是很好或者其他原因，你可以看下面的讲解。在一个div#box里面放置一个浮动的div#float（例如：里面的内容是2行文字）和一个没有任何 CSS样式的div#content（例如：里面的内容是1行文字），然后在它们的下面放置一个div#clear（例如：里面的内容是1行文字）。演示html代码：<style type="text/css">    #box {background: #eee;}    #float {float : left;}    #clear {clear: both;}</style>     左边漂浮的任意内容<br/>这是为了比右边的内容高一点    任意输入的内容    下面清除的标签  这样的话在IE7及其它标准浏览器浏览是没有问题的，分别显示出这3块文字内容，但是在IE下浏览时就只显示出了div#float、div#clear里面的内容(演示)，div#content就莫明奇妙的消失了，在哪里？你把鼠标放在应该显示的地方划一划，就出现了本该出现的内容。也就是在变化背景的时候它就会出现，你也可以在div#clear下面放置很长很长的内容，也就是使浏览器出现滚动条，你向下拖动滚动条再拖回来，它一样也出现了，这样就明白了它为什么叫Peekaboo！修复Peekaboo Bug几种方法:● 不要在div#box里面使用背景，或者保持div#clear和div#float在一起。● 给div#box一个明确的“宽度”或“高度” 。#box { height: 100%; /* kill peekaboo bug in IE */}● 把div#box和div#float的定位类型都设置为“相对”。

原文来源：http://www.osxcn.com/