css3 クラスに制限されたタイプのn番目[重複]。

質問

css3の nth-of-type をクラスで制限する方法はありますか？私は、動的な数の section 要素があり、レイアウトの必要性を指定する異なるクラスがあります。私は、3番目の .module を取得したいのですが、どうやら nth-of-type はクラス要素の型を調べてから型を計算しているようです。代わりに、私はそれを .module s.

ありがとうございます！

JSFiddleによるデモです。 http://jsfiddle.net/danielredwood/e2BAq/1/

HTMLです。

<section class="featured video">
    <h1>VIDEO</h1>
</section>
<section class="featured module">
    <h1>NOT A VIDEO</h1>
</section>
<section class="featured module">
    <h1>NOT A VIDEO</h1>
</section>
<section class="featured module">
    <h1>NOT A VIDEO (3)</h1>
</section>
<section class="featured module">
    <h1>NOT A VIDEO</h1>
</section>
<section class="featured module">
    <h1>NOT A VIDEO</h1>
</section>
<section class="featured module">
    <h1>NOT A VIDEO (6)</h1>
</section>

CSSです。

.featured {
  width:31%;
  margin:0 0 20px 0;
  padding:0 3.5% 2em 0;
  float:left;
  background:#ccc;
}
  .featured.module:nth-of-type(3n+3) {
    padding-right:0;
    background:red;
  }
  .featured.video {
    width:auto;
    padding:0 0 2em 0;
    float:none;
  }​

どのように解決するのですか？

残念ながら、(少なくとも私が知っている限りでは) nth-of-type を選択する方法はありません。 nth-of-class は存在しないからです。おそらく、3つ目の .module に新しいクラスを手動で追加する必要があるでしょう。