写在前面
ie6真是一个头疼的问题，让前端人员真的是伤透脑筋，却经常还是无法解决，今天我又一次遇到了一个关于在ie6下li左浮动换行产生的问题，最终没有办法解决，选择放弃了li而采用span标签！悲剧啊，由于本人的水平有限，希望大神能够指点一二啊！接下来我给大家说说我的情况啊，不知道大家在遇到时是怎么解决的呢？
首先直接看源码
html部分：
<div class="xiaoxue">
<ul>
<li class="white12">小 学：</li>
<li><a href="#">优酷网</a></li>
<li><a href="#">奇艺高清</a></li>
<li><a href="#">搜狐视频</a></li>
</ul>
<ul>
<li><a href="#">搜狐视频</a></li>
<li><a href="#">酷6网</a></li>
<li><a class="red12" href="#">更多>></a></li>
</ul>
</div>
css部分：
.xiaoxue{width:718px; height:157px; border-bottom:#6DBA2B 2px solid; margin-bottom:11px; background:url(../img/bg-xiaoxue.jpg) no-repeat; padding-left:8px; padding-right:8px;}
.xiaoxue li{ height:29px; padding-left:10px; padding-right:10px; float:left; line-height:29px; /** display:inline; zoom:1;*/}
这样写成的代码，在火狐下面是完全正常的，而在ie6下却发生了杯具，ie7和8我没有测试，不过应该问题不大！接下来看看ie6和火狐下面的截图：
ie6下不正常：
火狐下正常的：
准备通过一些解决css hack的方法去解决这个问题，但是却无法解决他，相信大家看到我的css代码里最后面的两句注释掉了，那个是用来解决ie6 hack的，但是我取消注释的时候，ie6下仍然还是那样，火狐也还是原先那样，这里我尝试着注释掉了float:left;这句，结果ie6下可以了，达到了原先火狐下的效果，但是火狐下杯具了；然后准备通过ie6下另外调用另一个css来解决这个问题，但是依然无效，其他的几种hack方法也都尝试了，依然无法解决，最终迫于无奈之下只能通过不使用li这种block属性的标签去解决，而改用span这种inline属性的标签，现在可以使ie6和火狐下效果一样了，相信ie7和8也应该没有问题的。知道大家是怎么解决的呢？
通过写下刚才那段话，我突然发现一个问题，我想给li加上inline属性和我现在使用span标签不是同样地意思么？而使用span可以让火狐和ie6效果相同，那不正是解决hack的一种方法么？不知道大家认为我想的对不对哈，欢迎给以指正哈！
由于本人在前端方面还属于一个菜鸟级别，所以有很多css的hack都还不能完美的解决，希望大家多多给予关照哈！
//2013-2-3 补充
我需要所有的li在同一行显示，不固定Li的宽度，如果一行排不下，需要自动换行。当然Li的内容长度不同。
必须在li加white-space:nowrap;
转载请注明：Rockyxia Web技术博客 » [ie6hack]如何解决ie6下li左浮动换行产生的hack
感谢阅读，如果您发现文章中有表述不准确，欢迎提出来，也欢迎交流相关问题，你可以去这里进行一对一问答交流。