解决IE6，ie7下元素左浮动自动换行的问题

时间：2015-01-21 14:45:59 阅读：233 评论：0 收藏：0 [点我收藏+]

标签：

html结构如下：

xhtml代码
<ul> 
<li><a href="category.php?id=7">考研英语</a></li> 
<li><a href="category.php?id=8">考研数学</a></li> 
<li><a href="category.php?id=9">考研政治</a></li> 
<li><a href="category.php?id=10">统考专业课试题</a></li> 
</ul> 

一开始写的css如下：

xhtml代码
<style type="text/css"> 
ul { clear:both; margin:0 15px 0 25px;} 
ul li {height:20px; float:left; width:auto; margin-left:5px;} 
</style> 

FF和IE8正常,但在IE6就悲催了...

技术分享

解决方法：自适应宽度的左浮动元素加上display: inline-block;overflow: hidden;white-space: nowrap;

xhtml代码
ul { clear:both; margin:0 15px 0 25px;} 
ul li {display: inline-block;overflow: hidden;white-space: nowrap; height:20px; float:left; width:auto; margin-left:5px;} 

完美解决问题。

解决IE6，ie7下元素左浮动自动换行的问题

标签：

原文地址：http://www.cnblogs.com/weiqian/p/4238625.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行