DIV+CSS页面设计中的IE6的文字溢出BUG

为什么这个div的文字在ie6里会多出3个字符，在页面制作中用DIV+CSS用的多了有时会遇到文字溢出的现象，出现此现象是由IE6的3PX的BUG所引起的。

以下为出现该BUG的实例：

<div style="width:400px">

<div style="float:left"></div>

<!-- -->

<div style="float:right;width:400px">↓注释在IE6中造成文字溢出实例</div>

</div>

而其解决方法是在 去除<div style="float:left"></div> 中的“float:left;”，你会发现多出来的“猪”字不见了，页面正常显示，

解决方法二：将注释移动到<div style="float:left"></div> 的上面，页面也不会出现此BUG

解决方法三：去除内浮动层<div style="float:right;width:400px"> 的宽度定义（width:400px），此BUG也会消失。

而在测试过程中也会发现：增加注释的条数：当1条注释时，则多出来1个字；2条注释时，则多出来3个字；3条注释时，则多出来5个字……

我们会从上面的规律中得到这样一个公式：溢出文字的字数=注释的条数*2-1，这里的字数在中文或英文数字时都成立。

当溢出的文字字数大于文本的字数时，文字区块将会消失。

其实最简单的方法就是不放置注释内容，然后这在现实的工作中会导致某些不方便。因此，有朋友也想到了，稍微注意一下，将注释内容不要放置在两个浮动层之间

其解决方法五：将文字区块包含在新的<div></div>之间，如：<div style="float:right;width:400px"><div>↓注释在IE6中造成文字溢出实例</div></div>

然而在我的工作中却发现，我不仅仅只有注释会引发此BUG的出现，在网页间使用JS代码标签"<script>"这会出现此问题。如：

<div style="width:400px">

<div style="float:left"></div>

<script type="text/javascript">

</script>

<div style="float:right;width:400px">↓注释在IE6中造成文字溢出实例</div>

</div>

本文来自亿企乐网站，转载请标明出处：/A/?C-1-48.Html