關於高度塌陷問題解決方法

如果父元素只包含浮動元素，且父元素未設置高度和寬度，那么它的高度就會塌縮為零，也就是所謂的“高度塌陷”。

如果父級元素包含背景或者邊框，那么溢出的元素就不像父級元素的一部分了。

解決“高度塌陷”問題的方法：

1.浮動父級元素，父級元素的高度就會擴大，直到完全包含它里面的浮動元素。如果使用這種方法，一定要在該元素的

  下個元素添加clear:both,確保浮動元素落到父級元素的下方。 

2.使用overflow:hidden,zoom:1 。overflow:hidden屬性會強制父級元素擴大到包含浮動元素，zoom:1只是觸發ie6

   的hasLayout模式，不會對其他瀏覽器產生影響。

{ 
　　overflow:hidden; 
　　zoom:1; 
}

3.使用:after偽類清除，不會影響其他任何樣式，通用性強。

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