i am child
i am father
我們期待的效果是,child的頂部距離parent 30px，但是結果是child距離父div的margin仍然是0，反而parent頂部距離自己的父元素30px.
產生原因：
來看css2.1盒模型中規定的內容：
in this specification, the expression collapsing margins means that adjoining margins (no non-empty content, padding or border areas or clearance separate them) of two or more boxes (which may be next to one another or nested) combine to form a single margin.
總結：1. 巢狀的元素也共享margin
2. 乙個盒子如果沒有上補白(padding-top)和上邊框(border-top)，那麼這個盒子的上邊距會和其內部文件流中的第乙個子元素的上邊距重疊。
解決辦法:
1、修改父元素的高度,給父元素加上padding-top:40px;
2、為父元素新增overflow:hidden
3、為父元素新增border
4、為父元素或者子元素宣告絕對定位。
5、為父元素或者子元素宣告浮動
子元素margin top屬性傳遞給父元素的問題
問題描述 乙個父包含框包含乙個子元素。給正常流的子元素乙個垂直外邊距margin top就會使得父元素跟著往下走，而子元素和父元素的邊距則沒有發生變化。html結構 css樣式 box1 box1 1 解決辦法 1.修改父元素的高度，增添padding top樣式模擬 常用 2.為父元素新增over...
關於子元素的margin top影響父元素
來看看這個問題 子元素為什麼設定margin top會影響父元素的margin top。先把html,body,div的預設margin，padding設為0,再給父元素設定寬高，子元素設定寬高。然後又設定子元素的margin top為20px。效果如下 查了下，簡單來說是因為父元素沒有設定padd...
子元素的margin top會影響父元素
恢復內容開始 在css2.1盒模型中 in this specification,the expression collapsing margins means that adjoining margins no non empty content,padding or border areas o...