總結一下：
要想實現如（圖一）效果，（即乙個div中的子元素與父元素有間距）：
如果類名為.middle的父元素沒有寫border，則類名為firstchild的子元素設定margin-top，會導致父元素與相鄰的top元素產生間距。
①類名為.middle的父元素加上border屬性，但不足是加入border後會導致.middle超出2px，所以middle的高度還需要減去2px。
②類名為.middle的父元素不用加border，可以使用padding將子元素隔開。但不足之處也是需要將height減去padding的高度。
③文章《css設計模式之三權分立模式篇》提出解決問題②的方法是在子元素中使用padding屬性，將margin、border、padding分開來寫。
綜上所述，為了避免使用margin會在父元素沒有設定border時產生間距混亂的問題，可以在子元素上設定padding，利大於弊！
關於margin和padding的問題
ie 6.0 firefox opera等是 color red 真實寬度 width padding border margin color ie5.x color red 真實寬度 width padding border margin color 很明顯，第一種下很完美的布局在第二種情況下後果...
關於margin疊加問題
只有普通文件流中塊元素的垂直邊界才會發生邊界疊加。行內框 浮動框或絕對定位框之間的邊界不會疊加。1.發生外邊距疊加的情況 外邊距 margin 重疊示例 1.1外邊距重疊是指兩個垂直相鄰的塊級元素，當上下兩個邊距相遇時，起外邊距會產生重疊現象，且重疊後的外邊距，等於其中較大者。1.2另乙個重疊現象是...
margin塌陷和margin合併問題及解決方案
父子巢狀元素在垂直方向的margin,父子元素是結合在一起的,他們兩個的margin會取其中最大的值.正常情況下,父級元素應該相對瀏覽器進行定位,子級相對父級定位.但由於margin的塌陷,父級相對瀏覽器定位.而子級沒有相對父級定位,子級相對父級,就像坍塌了一樣.margin塌陷解決方法1.給父級設...