IE6下 float:right 后换行的问题

来源：互联网发布：全本小说软件下载编辑：程序博客网时间：2024/06/05 03:30

http://www.cnblogs.com/blosaa/archive/2012/12/10/2810811.html

IE6下有不少奇怪的Bug，今天就碰到一个，float right换行bug，情况是并列的几个块级元素如div和span，一些设置了左浮动一些设置右浮动，一行的宽度足够放下所有的块级元素，但此时ie6则显示右浮动的其中一块换行了，下面给出实例和解决方法：
实例说明下：html结构如下
<div>
<span class="left">左边</span>
<span class="center">中间</span>
<span style="float: right" class="right">右边</span>
</div>.left和.center都没有 float 属性，然后在FireFox，google chrome及IE7、IE8等浏览器下都正常显示，可在Internet Explorer 6 下有bug：本来排一行的左边+中间+右边，可右边淘气的跳到了下一行。

解决方案：

1.不用修改css什么的，只要把float的模块放到非float的前面即可。
上面的html结构重排下序：
<div><span style="float: right" class="right">右边</span> <span class="left">左边</span> <span class="center">中间</span> </div>
     优点：不用谢多余的代码。
     缺点：破坏语意
2.绝对定位。
     优点：不破坏语义。
     缺点：代码量加大。
3.给他们都添加浮动。
     优点：同上。
     缺点：会引起其他bug等。
4.添加hack。_margin-top:XXXXpx;
     优点：同上。
     缺点：使用了hack。