父容器高度塌陷问题

父容器高度塌陷问题

当子元素设置了float属性后，父元素会因子元素脱离文档流而发生塌陷问题，解决这种问题的方式有三种

1.在父容器后添加一个空div

<div style="clear:both;"></div>

2.给父容器设置overflow属性

{ 
　　overflow:hidden; 
　　zoom:1; 
} 

3.设置after属性

设置父元素的class属性为clearfix，并修改样式

.clearfix{ 
　　zoom:1; 
} 
.clearfix:after{ 
　　content:''; 
　　display:block; 
　　height:0; 
　　font-size:0; 
　　clear:both; 
　　overflow:hidden; 
} 

以上的zoom属性都是为了兼容IE6设置的，对其他浏览器无影响