保證金底部添加到頂部

我想創建一個空間在我的頭div上方和下方，所以我給它一個保證金頂和保證金底。儘管底部沒有增加空間。相反，它將margin-bottom添加到頂部，而下面的內容恰恰相反。保證金底部添加到頂部

這是字面上所有的代碼，我至今在我的身上：

<body> 
    <div class="header"> 
     <img class="logo" src="Images/logo.png"/> 
     <ul class="navigation"> 
      <li class="Twitter"> 
       <a href="http://twitter.com/AccountLink"> 
        <img src="Images/twitter.png"/> 
       </a> 
      </li> 
     </ul> 
    </div> 
    <div class="banner"><img src="Images/banner.jpg"/></div> 
</body>

而且我的CSS：

ul { 
    list-style-type: none; 
} 

.header { 
    width: 800px; 
    margin: 0px auto; 
    margin-top: 25px; 
    margin-bottom: 25px; 
} 

.header .logo { 
    padding-top: 10px; 
    float: left; 
} 

.header .navigation { 

    float: right; 
}

來源

2013-04-06 Andrew

哪個元素，你指什麼？你在'header'上明確地設置了'margin-top'，這就是它在那裏的原因。我不明白這個問題。 – 2013-04-06 10:20:03

你想要什麼？僅在頭部的底部添加邊距？ – 2013-04-06 10:28:27

.header { 
    width: 800px; 
    margin: 25px auto; 
    overflow: hidden; 
} 

.banner { 
    display: inline-block; 
    margin: 25px auto; 
    width: 100%; 
}

兼容性表：http://caniuse.com/#feat=inline-block

來源

2013-04-06 11:06:12 glocsw

您已漂浮導航，但你的頭不指定高度。導航後應用某些元素清除或應用溢出：隱藏;到您的標題。例如：

.header { 
    width: 800px; 
    margin: 25px auto; 
    overflow: hidden; 
}

的瀏覽器

來源

2013-04-06 10:30:23 Kaloyan

try using padding instead of margin 

    padding-top: 25px; 
    padding-bottom: 25px; 

also add 
.banner{ padding-top:10px;} 

or adjust to your needs

來源

2013-04-06 10:30:34

保證金底部添加到頂部

回答

相關問題