我不确定这是一个错误还是这里有一些神秘的 CSS 规则在起作用。 基本上，子元素的边距设置将在其父元素之外实现，即使父元素足够大以容纳子元素并且它的边距完全。
这是一个演示此操作的小型 HTML 文档:https://gist.github.com/skid/5048988 . 这发生在 Chrome 25 上，但不会发生在 Firefox 14 上。
最佳答案
From @Yosyhi comment : block 的顶部和底部边距有时会合并(折叠)为单个边距，其大小是合并到其中的边距中最大的一个，这种行为称为边距折叠。
边距崩溃发生在三种基本情况下:
- 相邻的 sibling
- parent 和第一个/最后一个 child
- 空 block
关于css - margin bleeding 是 WebKit 中的错误吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15116633/