在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换行问题的替代解决方案的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。