獨立元素的邊界如何影響固定元素的位置？

Question

我有兩個單獨的DIV s一個position : fixed爲通知欄，一個爲主容器，當我給container一些margin-top，這也推我的通知欄！

這裏是一個小提琴：http://jsfiddle.net/Zh9k8/2/

而且，我知道我能堅持到與top : 0頁面頂部，但我想知道爲什麼它會發生。

Answer 1

造成塌陷的利潤率普遍的問題：http://www.w3.org/TR/CSS21/box.html#collapsing-margins

解決方法是不使用保證金，而是創造空間的另一種方式。你可以頂邊距添加到.container和刪除保證金：

http://jsfiddle.net/Zh9k8/4/

的在流塊元素的上邊距崩潰，其第一 在流動塊級的孩子的上邊距，如果該元素沒有頂部 邊框，沒有頂部填充，並且孩子沒有通關。

如果元素的邊距與父元素的頂部邊距一起摺疊，則 方塊的頂部邊緣邊緣定義爲與父親的 相同。

非常混淆的術語，但它描述了到底發生了什麼。

Answer 2

您仍然可以使用邊距來創建空間。如果您在body上設置了最小填充量，它將消除固定塊的邊距塌陷。查看更新的小提琴：http://jsfiddle.net/BMCc9/。

body { 
    padding: 0.1px; 
}