为什么内部div（header_logo）也拉下了标题

Question

The image states my question clearly

[Code.io编码页] [2]

codepen.io/sachoosaini/post/why-the-header_logo-div-pull-down-the-header-when-i-change-margin-like-10px 第二个是链接到css

Answer 1

这是因为折边利润，请在此处查看更多＆gt; collapse margins

一个解决方法是将overflow:auto添加到#header（父级div）

请参阅下面的代码段

并且，下次发布问题时，请访问mcve并在此处发布您的代码，而不是在外部网站上发布

body {
  background-color: #454343;
  margin:0;

}

#header {
  width: 961px;
  height: 184px;
  background-color: #D54C17;
  margin: auto;
  overflow: auto;
}

.header_logo {
  width: 361px;
  height: 133px;
  background-color: #986c6c;
  margin: 10px auto;
}

<div id="header">
  <div class="header_logo"></div>
</div>