Html div的边距尊重其母公司

我对利润感到困惑。我在div内容中有一个徽标。如果我给div标志加上一个页边空白，这个页边空白就会出现在内容和页面之间。为什么?

以下是一个例子：

CSS:

HTML:

---

这是因为块级元素的上边距及其第一个块级子元素的上边距将始终保持不变（除非任何边框、填充、线框或间隙将它们分隔开）。防止此行为的一种方法是添加一个

溢出

值，而不是

#content

div可见的值。您还可以将

#content

的显示值更改为内联块

---

这是因为块级元素的上边距及其第一个块级子元素的上边距将始终保持不变（除非任何边框、填充、线框或间隙将它们分隔开）。防止此行为的一种方法是添加一个

溢出

值，而不是

#content

div可见的值。您还可以将

#content

的显示值更改为内联块

#content {
    position:relative;
    margin:0 auto;
    width:300px; height:250px;
    background-color:blue;
}

#logo {
    margin:20px auto; /* Why this 20px appear between the page and the content? */
    width:120px; height:120px;
    background:yellow;
}

<div id="content">
    <div id="logo"> </div> 
</div>