__x__(43)0910第六天__ clearfix 解決：垂直外邊距重疊，高度塌陷

<div class="box1">
    <tabl></table>
    <div class="box2"></div>
</div>

原理1：

<table> 將會隔離父子元素，

因此解決垂直外邊距重疊問題方法1：

.clearfix:before{
    content:"";
    display:table;
}

---

原理2：

 解決高度塌陷方法2：

 

.clearfix:after{
    contemt:"";
    display: block;
    clear: both;
}

 

 

---

 

最終方法：

 

 

.clearfix {
    zoom:1;
}

.clearfix:before,.clearfix:after {
    content:"";
    display: table;
    clear: both;
}

 

給父元素加 class="clearfix"; 便可。