奇怪的CSS3保證金問題

Question

我目前正在瀏覽團隊樹屋網站上的教程視頻，並且存在這個奇怪的問題，我無法弄清楚。

我上傳的煉功點這裏：http://www.oneniceday.com/about.html

基本上，我想10％的上邊距添加到下面的水平導航鏈接欄的整個部分。

因此，在適當的ID，我加了10％的保證金頂端：

#wrapper 
{ 
max-width: 940px; 
margin:10% auto; 
padding:0 0%; 
background-color:black; 
} 

但是，對於一些奇怪的原因，雖然利潤率最高值應用於#wrapper指定類，似乎瀏覽器以某種方式將其應用到H1類，現在H1類在頂部有10％的邊距！ （這就是爲什麼你看到我的網站在綠色行上方有很大差距）

這是怎麼回事？

Tks！

Answer 1

發生此問題的原因是header有float: left;，並且header真的沒有理由擁有該屬性。

如果添加浮動修復的h1保證金可以轉而加入這個「clearfix」：

header::before { 
    content: ''; 
    display: table; 
    clear: both; 
}