IE7浏览器float:left li标签文字自动换行

Li标签Float:left在做网页侧栏的一些tags的时候，是一种很好的选择。不过在中文字符上，可能会出现一点小问题，先看一张IE7和IE8下的效果图吧：

 

 

看起来的确狠蛋疼，在标准浏览器中是不会出现上图IE7的效果的。先看下代码结构

<style>
.city {width:200px;border: 1px solid black;overflow: hidden; padding: 0;margin:0;}
.city li{float:left; list-style: none; margin: 5px;}

<div class="box">
    <h3>City</h3>
    <ul class="city">       
        <li>厦门</li><li>桂林</li><li>张家界</li><li>贵州</li><li>新疆</li><li>宁夏</li><li>四川</li><li>重庆</li><li>东北</li><li>北京</li><li>云南</li><li>西藏</li><li>华东</li><li>甘南</li><li>江西</li><li>三峡</li><li>海南</li><li>山东</li><li>青海</li><li>夕阳红</li>
    </ul> 
</div> 

解决方案很简单，就是在Li中添加一条样式 white-space: nowrap;   www.it165.net

.city li{float:left; list-style: none; margin: 5px; white-space: nowrap;}

转自:http://www.it165.net/design/html/201212/1621.html