li标签float:left在做网页侧栏的一些tags的时候,是一种很好的选择。 不过在中文字符换行问题上,可能会出现一点小问题,先看一张ie7和ie8下的效果图吧: 上图ie7的效果看起来的确很蛋疼,但是在标准浏览器中是不会出现上图ie7的效果的。 首先看下css代码结
li标签float:left在做网页侧栏的一些tags的时候,是一种很好的选择。
不过在中文字符换行问题上,可能会出现一点小问题,先看一张ie7和ie8下的效果图吧:
上图ie7的效果看起来的确很蛋疼,但是在标准浏览器中是不会出现上图ie7的效果的。
首先看下css代码结构
.city { width:200px; border: 1px solid black; overflow: hidden; padding: 0; margin:0;}.city li{ float:left; list-style: none; margin: 5px;}
其次是html结构
city 厦门桂林张家界贵州新疆宁夏四川重庆东北北京云南西藏华东甘南江西三峡海南山东青海夕阳红
解决方案其实方案很简单,就是在li中添加一条样式 white-space: nowrap;
.city li{ float:left; list-style: none; margin: 5px; white-space: nowrap;}
原文地址:float:left li中文标签在ie7中被自动折行, 感谢原作者分享。