html - 没有空白的网格 div

Question

我正在用 div 制作一个网格 Wordpress 主题。但是在三个 div 之后，在第四个出现之前有一个空白。这是由于高度不同。我怎样才能让div没有空白区域？您可以预览它的外观 here .

CSS 是:

#wrapper #frontpage .box {
    float: left;
    position: relative;
    top: 0;
    width: 380px;
    margin-right: 30px;
    margin-bottom: 30px;
    font: 100 12.5px 'Helvetica';
    line-height: 18px;
    color: #3a3a3a;
    background: #f1f1f1;
}#wrapper #frontpage .box:nth-child(3n+3) {
    margin-right: 0;
}

html 是对九个帖子的查询。

<div class="box">
    Content here
</div>

Answer 1

您可以使用 css3 - columns 然后您可以在 3 列中显示您的 div，并且它们之间没有空格。

css3 - columns on w3schools