在IE6,IE7下使用<span>标签时,在加入右浮动样式后,会换行的bug解决方案:
bug案例:新闻列表中,为使时间右对齐,加右浮动产生换行
<ul>
<li><a href=“#”>新闻1</a> <span>2012-12-24</span></li>
<li><a href=“#”>新闻1</a> <span>2012-12-24</span></li>
<li><a href=“#”>新闻1</a> <span>2012-12-24</span></li>
<li><a href=“#”>新闻1</a> <span>2012-12-24</span></li>
bug案例:新闻列表中,为使时间右对齐,加右浮动产生换行
<ul>
<li><a href=“#”>新闻1</a> <span>2012-12-24</span></li>
<li><a href=“#”>新闻1</a> <span>2012-12-24</span></li>
<li><a href=“#”>新闻1</a> <span>2012-12-24</span></li>
<li><a href=“#”>新闻1</a> <span>2012-12-24</span></li>
</ul>
解决方案:
1.
span和a标签交换位置.
<li><span>2012</span><a>新闻</a></li>
缺点:语义结构发生改变,不合逻辑.
2.
a加左浮动,span加右浮动
3.
使用IE hack 在span标签中加入只有IE6,7可以识别的样式
*margin-top:20px;
_margin-top:20px;
说明,使换行的部分根据margin-top再呈现出来.
本文详细介绍了在IE6,IE7浏览器中,当使用<span>标签进行右浮动布局时,可能会导致元素换行的问题,并提供了三种解决方案:调整元素顺序、修改CSS属性以及使用IEhack来修复该bug。
1050

被折叠的 条评论
为什么被折叠?



