子div影響父div？

我想要做的是給一個div margin-top: 30px;但它似乎是整個頁面移動30px，而不是隻有該div。這就像孩子div影響父母的div？子div影響父div？

有什麼建議嗎？

HTML：

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="BBcolForum.master.cs" Inherits="BBcolForum.BBcolForum" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <link type="text/css" rel="stylesheet" href="css/default.css" />  
    <asp:ContentPlaceHolder ID="head" runat="server"> 
    </asp:ContentPlaceHolder> 
</head> 
<body> 

<div id="content"> 
    <form id="form1" runat="server"> 

    <div class="header" style="margin-top:0px;"> 
    <h1 style="color:Aqua; margin-top:30px;">Student Forum</h1> 
    </div> 

    <div> 
     <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> 



     </asp:ContentPlaceHolder> 
    </div> 



    </form> 
</div> 


</body> 
</html>

CSS;

body 
{ 
    background-image:url('/img/blue_back.png'); 
    background-repeat:repeat-x; 

} 

#content 
{ 
    background-color:White; 
    width: 800px; 
    height:900px; 
    margin: 0 auto 0 auto; 

} 

.header 
{ 
    border-bottom:1px solid #000000; 
    height:100px;  
    color:Blue; 



}

來源

2013-06-03 user2413519

它被稱爲* margin collapse *。 – cimmanon

這就是發生了什麼，是的。具有margin-top的元素的直接子元素也會推送父元素。作爲一個非常簡單/快速的修復，你有沒有考慮使用填充？

如果失敗，則可以根據this previous discussion on the topic和this one too對父級使用overflow：auto。

來源

2013-06-03 15:06:53 johnkavanagh

好吧，\ nd否我是新來的CSS，所以請你給我提供一個在這種情況下填充如何工作的例子嗎？ – user2413519

啊不用介意我已經使用你建議的填充來解決它了謝謝+1 – user2413519

@ user2413519如果有任何答案有幫助，並且解決了你應該接受的問題。 – pzin

嘗試將padding:0.01px添加到容器。這將沒有視覺效果，但它會導致保證金適用於正確的地方。

來源

2013-06-03 15:08:55

這是<h1>的保證金。這對我來說似乎總是不直觀。您可以通過將overflow: auto;放在容器上或將h1的邊距改爲填充來修復它。

來源

2013-06-03 15:09:15

您必須更改

<h1 style="color:Aqua; margin-top:30px;">Student Forum</h1>

到

<h1 style="color:Aqua; padding-top:30px;">Student Forum</h1>

保證金適用對象以外的空間，而裏面填充它適用。

來源

2013-06-03 15:09:58 Arun

子div影響父div？

回答

相關問題