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;}
完美解决问题。
