IE6浮动列表li最右侧竖直排列

在IE6中，把li左浮动后，在最右侧经常会出现竖直排列的情况,而在火狐浏览器中文字放不下了会自动换行。

CSS代码

*{
list-style:none;
padding:0;
margin:0;
font-size:14px;
}
.sjyhome{
float:left;
width:360px;
padding-left:50px;
}
ul li{
float:left;
padding:5px;
}

HTML代码

<div>
<ul>
<li><a href="#">sjy之家</a></li>
<li><a href="#">sjy之家</a></li>
<li><a href="#">sjy之家</a></li>
<li><a href="#">sjy之家</a></li>
<li><a href="#">sjy之家</a></li>
<li><a href="#">sjy之家</a></li>
</ul>
</div>

IE6浮动列表li最右侧竖直排列解决方案

方案一、只要给li增加white-space:nowrap;即可。

方案二、修改CSS代码

*{
list-style:none;
padding:0;
margin:0;
font-size:14px;
}
.sjyhome{
float:left;
width:410px;
}
ul{ padding-left:50px; }
ul li{
float:left;
padding:5px;
}

CSS代码中标有颜色部分是更改项，再次测试，ie6和firefox中显示的结果一样了。

ie6确实存在这样一个问题，定义内边距的时候要提出来在一个单独的盒子里定义，所以我给ul定义了左内边距为50px 而没有在.sjyhome盒子里定义 就是多加一个盒子 单独定义这个内边距。