网格div没有空格

时间:2012-09-08 20:46:48

标签: html css html5 css3 grid

我正在制作一个带有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是对9个帖子的查询。

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

1 个答案:

答案 0 :(得分:1)

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

css3 - columns on w3schools