如果您有一个上边距的孩子，为什么身体标签会发生变化答案

【问题标题】：why does a Body Tag shift if you have a child with a top margin如果您有一个上边距的孩子，为什么身体标签会发生变化
【发布时间】：2014-02-22 10:09:28
【问题描述】：

我花了很多时间来解决这个问题。如果您有一个顶部有一些边距的 div。根据 chrome 开发工具，body 位置从 div 的起始点开始。基本上它不考虑偏移量的余量。虽然它确实认为高度计算是相同的。

例如 -

<body>
    <div> my content my content my content my content my content my content my content my
    </div>
</body>

我已经为它创建了一个 jsFiddle -- http://jsfiddle.net/tusharmathur/kW4v4/

【问题讨论】：

什么？ jsfiddle.net/kW4v4/1
chrome 开发工具中的正文大小似乎是 - 11160px，等于包含文本的 div。现在，如果主体从 iframe 的顶部开始，那么它们怎么可能具有相同的高度？我希望你明白我的意思。

【解决方案1】：

由于折叠边距：http://www.w3.org/TR/CSS2/box.html#collapsing-margins

这意味着，当没有填充或边框妨碍时，文档流中的两个元素将共享它们的边距，就像一个幸福的大家庭。

body 正在吸收div 的上边距。

这是 aeons 规范的一部分。

您可以在body 中添加 1px 的内边距或边框来阻止它发生。

【讨论】：