HTML block 元素的盒模型中有些东西我无法理解。
请看下面的 jsFiddle:
有外层和内层<div> , 并且它们的左边、顶部、右边和底部都有相同的边距。外层<div>的边距是透明的，所以我们可以看到彩色区域周围的白色主体。然而，内部 <div>的边距仅在左侧和右侧可见。在我看来，应该有50px的红条。橙色区域上方和下方的高度。
为什么我错了？
最佳答案
垂直margins collapse彼此(根据您可以在该链接的另一端找到的一些相当复杂的规则)，因此内部边距顶部占据外部边距顶部的下半部分。
关于带边距的 HTML 框模型，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13704793/