li下沉 margin-top越界 浮动带来的影响

使用li嵌套实现的二级导航菜单，在IE浏览器下显示正常，而在谷歌及360极速模式下最后的几个li标签下沉了，其实在webkit内核的浏览器中都会有这种情况，如下图：

出现此种状况，有两种可能：

1、导航条的宽度不够，使得最后的几个li标签容纳不下，因此错行下沉，此时只需调整导航条和li标签的宽度；

2、横排的导航条是通过li标签设置浮动实现的，即li标签的float属性，当设置li浮动而其所在的ul标签未设置浮动时也会出现此种状况，此时只需为li所在的ul设置float属性即可；为固定导航条的位置，可通过div标签先将位置固定，再使用ul li标签设置浮动实现；

 

经测试，我的网站属于第二种情况，所以设置浮动时，尽量一个div中的子元素都设置浮动，不要设一部分。

不行就是margin-top越界使用伪元素清除浮动

.header:after,.sec_head:after,.sec_img:after,section:after,
.header:before,.sec_head:before,.sec_img:before,section:before{content:"";display:table;clear:both;}

这里的元素是当前元素和受影响的元素

或者设置margin-top为负值；