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

html结构如下：

xhtml代码

1. <ul>
2. <li><a href="category.php?id=7">考研英语</a></li>
3. <li><a href="category.php?id=8">考研数学</a></li>
4. <li><a href="category.php?id=9">考研政治</a></li>
5. <li><a href="category.php?id=10">统考专业课试题</a></li>
6. </ul>

一开始写的css如下：

xhtml代码

1. <style type="text/css">
2. ul { clear:both; margin:0 15px 0 25px;}
3. ul li {height:20px; float:left; width:auto; margin-left:5px;}
4. </style>

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

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

xhtml代码

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

完美解决问题。