用特定的子元素类型定位CSS中的第n个元素？ #content article article article

Question

我在wordpress上加载动态帖子。这些帖子在一篇文章＆＃39;中。在jsfiddle上测试CSS工作http://jsfiddle.net/aS4me/，但在实际网站上，它不起作用，它始终以第二部分内容为目标。

样品： http://brookfield.wpengine.com/properties/

当前的CSS： `

    #content > article {

        min-height: 30px;
    }
    #content > article:nth-child(4n+4) { 
        margin-right: 0;
        background:red;
    }

`

Answer 1

那是因为nth-child并不意味着nth-of-type：）

围绕这个可能更难，但你的代码（文章：nth-​​child（4n + 4））找到4n + 4元素（div或article或者其他）和如果该元素是一个文章，它适用于造型。

所以，你的文章：nth-​​child（4）元素是#content（div + div + article + article）中的第4个元素，但只是第2篇文章。

因此，您可能希望使用nth-of-type：

  #content > article:nth-of-type(4n+4) { 
        margin-right: 0;
        background:red;
 }