CSS：外邊距合併問題

外邊距合併問題有兩種狀況：（1）同級元素，當垂直方向上外邊距相遇，它們會發生合併，合併以後會取外邊距最大者。（簡單說：兩個相鄰div上面一個設置margin-bottom,下一個設置margin-top，這兩個div的實際距離取margin-bottom/margin-top最大值;）

結果：

解決方法：

（1）去掉一個margin,而後設置另一個；

（2）給兩個元素設置左浮動，而且清除第二個元素的左浮動（clear：left;）

  (3)給兩個元素添加絕對定位,而且設置top值（相對於它們最近的定位的父級元素/或者body），但此時它們的父元素沒有高度；

(2)父子關係的元素：當子元素設置margin-top/或者父子元素都設置margin-top時（取最大值），而且父元素沒有border(邊框);

此時的margin-top都會做用在父元素上（ji父子元素一塊兒移動）

結果：

解決：1.給父元素加邊框；

           2.父元素觸發BFC（block format context塊級格式化上下文）知足下面任意一種便可（又會帶來元素塌陷問題）

• Float的值不是none;帶來的問題：父級元素的父級元素寬度爲0）
• position的值不是static/relative;（帶來的問題：父級元素的父級元素寬度爲0）
• display的值爲：inline-block;table-cell；
• overflow的值不是visible;（帶來的問題：IE6下不支持）；

3.給元素加相對定位，子元素加絕對定位；

4.給元素加相對定位（設置top值）；