使用CSS制作具有边距的均匀大小的div的液体网格

Question

如何在CSS中制作具有统一大小和边距的元素的液体网格？

我遇到的主要问题是边缘。我觉得明显的解决方案是将宽度和边距设置为百分比并完成。这不起作用，因为垂直边距是容器宽度的百分比。当容器水平调整大小时，垂直间距关闭。

我尝试了两种方法。一个人percentage margins和one with 'em' margins。它们都没有正确缩放。我该怎么办？

Answer 1

你正在寻找这样的东西吗？ http://jsfiddle.net/LMJTu/

在小提琴上，单击按钮以更改外部div的大小。

Answer 2

好吧，我找到了解决方案。我将每个按钮包装在一个容器元素中。外部容器与宽度和高度的百分比完美匹配。然后，内部元素有一个边距，以在每个按钮之间添加间距。

http://jsfiddle.net/9jGYK/4/

边距仍然取决于身体的宽度，但至少按钮的大小正确。那里有更优雅的解决方案吗？

Answer 3

是否可以让左右边没有填充或边距？ （所以它们之间的空间应该由宽度决定。