css3 nth typu zastrzeżonego do klasy

Question

Czy istnieje jakiś sposób ograniczenia klasy css3 do nth-of-type? Mam dynamiczną liczbę elementów section z różnymi klasami określającymi ich potrzeby w zakresie układu. Chciałbym pobrać co trzeci numer .module, ale wygląda na to, że nth-of-type wyszukuje typ elementu klasy, a następnie oblicza typ. Zamiast tego chciałbym ograniczyć go do tylko .module s.

Dzięki!

JSFiddle wykazać: 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; 
    }​ 

Answer 1

Niestety, nie ma sposobu (przynajmniej nikt nie znam), aby wybrać z nth-of-type klasa, ponieważ nth-of-class nie istnieje. Prawdopodobnie będziesz musiał ręcznie dodać nową klasę do co trzeciej .module.

Answer 2

Wydaje się, czego naprawdę chcą to css4 :nth-match selector, ale to naprawdę nie jest obsługiwane w większości przeglądarek jeszcze, więc obecnie jedynym sposobem na to jest z javascript

$(".featured.module").filter(function(index, element){ 
    return index % 3 == 2; 
}).addClass("third"); 

http://jsfiddle.net/w3af16dj/