众所周知的IE7是个前端的坑,这次又遇到了一个和float相关的,比较偏门的问题。

简单的说,就是一行内需要一个float:left的元素和一个float:right的元素,中间写上没有被任何html标志包裹的文本。

效果如下(IE8-10, Chrome, FireFox):

然后在IE7下,则很不客气的变成这这幅模样:

其实,这是因为文字上没有float属性而把right挤下去了。

解决办法有2个,

一是用span或者div或者随便什么把文字包裹起来加上float属性,就可以了。

二是把float:right的模块在html里写在text前面。