Selektor złożony nie działa w ostatniej wersji migającej: nth-child (2): nth-last-child (2) {}

jest dziwny problem: po mrugnięciu selektor aktualizacji.groups .group:nth-child(2):nth-last-child(2){} po prostu przestań pracować. Ale nadal działa dobrze w webkit i gecko. Jakieś pomysły, jak to naprawić?

HTML

<div class="groups">
    <div class="group"></div>
    <div class="group"></div>
    <div class="group"></div>
</div>

CSS

.groups .group{
    background-color:#000;
}
.groups .group:first-child{
    background-color:yellow;
}
.groups .group:nth-child(2):nth-last-child(2),
.groups .group:nth-child(2):last-child{
    background-color:red;
}
.groups .group:last-child:nth-child(3){
    background-color:green;
}
.groups{
    font-size:0;
}
.groups .group{
    display:inline-block;
    height:100px;
    width:30px;    
}

Możesz zobaczyć, jak to działa tutaj:http://jsfiddle.net/LAq73/1/

Jak to działa w mrugnięciu (chrom):

Jak to działa w safari (webkit):

I wreszcie FF:

Jakieś pomysły, jak to naprawić?

questionAnswers(2)

yourAnswerToTheQuestion