您的位置:首页 > 其它

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

2013-06-26 11:47 295 查看
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
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: