下面只有五个前(在IE6下多了一个前)
发生条件:
CSS中用了float属性,并且用了html注释<!-- 注释 -->,
补充说明:这个多文字bug在IE7和还在处于beta版的IE8已经得到解决。
下面给出解决方法
--------------------------------------------
代码:
<
div
style
="width:200px;"
>
< div style ="float:left;" ></ div > <!-- 在IE6下数一下有多少个前 -->
< div style ="float:left;width:200px;" > 前前前前前 </ div >
< div style ="clear:both;" ></ div >
</ div >
< div style ="float:left;" ></ div > <!-- 在IE6下数一下有多少个前 -->
< div style ="float:left;width:200px;" > 前前前前前 </ div >
< div style ="clear:both;" ></ div >
</ div >
前前前前前
解决方法一:在父级容器加入:display:inline;
代码:
<div style="width:200px;display:inline;">
<div style="float:left;"></div><!-- 在IE6下数一下有多少个前 -->
<div style="float:left;width:200px;">前前前前前</div>
<div style="clear:both;"></div>
</div>
前前前前前
解决方法二:在子级容器去掉注释
代码:
<div style="width:200px;">
<div style="float:left;"></div>
<div style="float:left;width:200px;">前前前前前</div>
<div style="clear:both;"></div>
</div>
前前前前前
一、 去除<div style="float:left"></div> 中的“float:left;”,你会页面正常显示。
同样去除 <div style="float:right;width:400px">中的“float:right;”,页面正常显示。
同样去除 <div style="float:right;width:400px">中的“float:right;”,页面正常显示。
解决:可使用display:block;display:inline-block;display:inline等组合替代float功能
二、注释造成文字溢出与其位置有关。注释造成文字溢出与文字区块的固定宽度有关。
解决:去除注释或者固定宽度;采用百分比宽度代替,注释不用放置在浮动区块之间。