之路

浮动元素最后一行的margin-bottom在IE6/7下失效的问题很早之前就碰到过，这次却有新的发现，bug的出现及出现在IE6或IE7中或2者都有和浮动元素的个数有关

当浮动元素个数为奇数时，此问题同时存在于IE6和IE7中，详见demo1及截图：

当浮动元素个数为偶数时，此问题存在于IE7中，详见demo2及截图：

进一步测试发现此问题存在于IE6或IE7中或2者都有还和浮动元素的父元素的宽度有关，以上2种情况是比较特殊的常见的情况，其他情况有兴趣的可以自己动手试试看(改变浮动元素的父元素的宽度)，一定会有自己的发现和体验

前端开发

这是一个奇怪的问题。最后一个li元素在IE6、IE7下换行了，其他的浏览器都是没有问题的。下面是此问题的截图及代码：

主要css代码及demo：

.wrap{width:960px; margin:0 auto;}
.wrap ul{background-color:#FF0000; padding-left:200px; color:#FFFFFF;}
.wrap ul li{float:left; padding:6px 30px;}

开始以为是因为“溢出”产生的换行，就用firebug查看并计算了一下盒模型：

最外层的.wrap 实际宽度是960px
ul的内容宽度是760px(960-200)
6个li的实际宽度是6*(30+30+48)=648px
很明显，所有li的实际宽度和远小于ul的实际宽度，因此并没有产生盒模型溢出，但问题却在IE6、IE7中出现了，实在令人费解

解决办法是给li一个大于等于48px的宽度，或给li加white-space:nowrap;强制其不换行，一般情况下会选择后者，因为一般情况下我们需要 li的宽度自适应
问题解决后的demo

前端开发