1

我希望有人可以帮助我，因为在这里问这样的问题我觉得很愚蠢。我不是网页设计师，但一直坚持创建基本布局的任务。该布局将在具有标准浏览器的集成设备上使用，因此某些浏览器特定的 CSS 标签 .. 即：-moz-border-radius 不一定需要与 IE 等一起使用。

我有一个 1024x768 的页面，我想在上面放置几个块。这些部分每边都有 4px 的空间。所以一个 2x2 的网格应该在整个站点的外部有 4px 的间隙（黑色），而内部的框之间有 8px 的间隙（一个框右侧 4px，左侧 4px，或底部 4px一个，顶部 4px 等）

当我将每个 div 的 CSS 设置为 margin: 4px; 我得到4px的外部间隙。我还在盒子的左侧和右侧之间得到了 8px 的水平间隙。问题是垂直间距是 4px，就像其中一个四分之一框没有应用顶部或底部边距。我不认为这是应该发生的事情，所以我认为我在某个地方犯了错误。

在此先感谢 - 这个地方很棒。

4

2 回答 2

2

这是由于“边距折叠”：在最简单的情况下，最小的相邻垂直边距会被忽略。

于 2010-11-18T23:18:21.277 回答
2

尝试使用填充而不是边距。

两个对象之间的最大边距用作它们之间的空间。

如果object_a边距为 4，object_b边距为 6，如果将它们并排放置，它们的边距为 6。

如果你使用填充，它会在它们周围产生更多的气泡，并结合距离。

如果object_apadding 为 4，object_bpadding 为 6，如果将它们并排放置，它们的 padding 将为 10。

更新——感谢@Bobby Jack

水平边距永远不会塌陷。只有垂直。

于 2010-11-18T23:19:42.637 回答