html - 使用 nth-child 选择特定的 div 类

Question

请看http://jsfiddle.net/kV7Uq/1/

.productList div.grid:nth-child(4n+5){
clear:left;
}

我想要实现的是创建一个 4 列网格。 fiddle 中使用的上述代码似乎很好 - 但如果您查看该 fiddle，则没有 4 列网格。

<div class="pageNav"></div>
<div class="pageHeading"></div>

上述两个也是容器 div 的子 div，并且位于网格 div 之前的 div 导致了冲突。如果这两个 div 被删除，网格就很好了。我不确定这是否可以修复，请帮忙 - 谢谢。

Answer 1

只需将其偏移 2 即可补偿那些 div。使用 +3 而不是 +5。

.productList div.grid:nth-child(4n+3){
    clear:left;
}

http://jsfiddle.net/kV7Uq/2/

如果您不希望第一个框有 clear: left 那么它将是 +7。