浮动是一个有意思（你也可以说它很麻烦）的CSS属性，任何元素设置了浮动，层级就提高了，会影响它后面没设置浮动的元素，这些倒霉的被影响者会跑到浮动层的下面去（当然IE6、IE7除外），那解决方法呢？
常用清楚浮动方法
1、对父级设置适合CSS高度
2、新建子元素，再clear:both清除浮动
3、给浮动元素的容器添加overflow:hidden;或overflow:auto;可以清除浮动，另外在 IE6 中还需要触发 hasLayout ，例如为父元素设置容器宽高或设置 zoom:1。
4、父级设置display:inline-block;
5、使用CSS的:after伪元素
.clearfix:after {
display: block;
clear: both;
height: 0;
font-size: 0;
content: '';
}
.clearfix {
*zoom: 1;
}
6、精益求精方法：
.cf:before,.cf:after {
content:"";
display:table;
}
.cf:after { clear:both; }/* For IE 6/7 (trigger hasLayout) */
.cf { zoom:1; }
详细好文章参考网址：http://www.jb51.net/css/67471.html
