对齐浮动div以填充整个空间

Question

所以我有一个720px宽的div，我用140px宽的div填充它，向左浮动。我希望能够将这些div与所包含的div的左右边缘齐平。

当然，问题是当我在浮动的div上放置一个margin-right时，右边缘将不会因为该边缘而排列。左边距产生相同的结果，但在左边缘。

有没有办法解决这个问题？

Answer 1

试试这个：Link

您可以将元素放入行中，并使用这些css2选择器检测first，middle和last元素。您可以为内部的不同位置指定不同的边距。

element:first-child {

}

element:last-child {

}

element .className {
     margin-left: 6px;
}

Answer 2

如果您使用服务器端语言生成这些div，您可以通过执行以下操作来计算行中的最后一项：

<div class="column <%if iteration % 6 == 0 %>last-in-row<%end%>"></div>

然后只设置样式

.column {
   margin-right: 10px;
}
.last-in-row {
  margin-right: 0;
}