twitter-bootstrap - 跳过第一项，然后每隔 x 重复一次规则

Question

当我有一个 bootstrp 网格，其中包装元素的高度不同时，我使用如下规则来确保每行上的元素数量相同。

.col-sm-6:nth-child(3),
.col-sm-6:nth-child(5),
.col-sm-6:nth-child(7),
.col-sm-6:nth-child(9) {
  clear: both;
}

我知道这不是最好的方法。如果我有一个非常大的网格，我需要像这样明确地为每一行指定清除。

如何将它写成重复规则，而不必指定每行环绕元素的开始？

Answer 1

.col-sm-6:nth-child(2n + 3) {
  clear: both;
}

但我建议您使用 flexbox 来避免 float 和 clear hacks。

只需添加到您的容器中:

.some-container {
    display: flex;
    flex-wrap: wrap;
}