浮动产生的问题以及解决办法

浮动产生的问题：

子元素脱离文档流不占位，父元素的高度撑不起来，下面的元素会往上移动。

解决办法：

1 ，给浮动元素的父元素设置高度（但是不灵活）
2，给浮动元素的父元素设置overflow:hidden/scroll/auto （常用）
溢出隐藏，父元素要知道子元素是否溢出，浮动元素也参与计算
3,在浮动元素的后面加一个空的块元素（二者是兄弟元素，非父子元素）。给这个空的块元素设置clear:both。
4，给浮动元素的父元素加clearfix的class名字。
.clearfix:after{
content:’ ';
display :block;
clear:both;
}
.clearfix{
*zoom:1;（解决i7浏览器以下不兼容的问题）
}
5,给浮动元素的父元素也加浮动。 （常用）