ie6 span 换行IE6中float:right换行问题的替代解决方案

在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> </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再呈现出来.

也曾看到过有网友通过在span的父类中设置相对定位,然后通过为span设置绝对定位和右浮动实现.有兴趣的朋友可以看下.

li {position:relative; width:200px;}li span{position:absolute; right:0px;}

　　

总结

以上是生活随笔为你收集整理的ie6 span 换行IE6中float:right换行问题的替代解决方案的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。