Li标签Float:left在做网页侧栏的一些tags的时候,是一种很好的选择。不过在中文字符上,可能会出现一点小问题,先看一张IE7和IE8下的效果图吧:
![\](https://i-blog.csdnimg.cn/blog_migrate/38f730836857cacdae950ccb8a3fec52.jpeg)
看起来的确狠蛋疼,在标准浏览器中是不会出现上图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