Question de sélection CSS3 pour tous, mais sélectionnez d'abord

Avec le balisage suivant, je veux qu'un sélecteur CSS sélectionne tout sauf le premier menu de sélection dans chaque div d'options - dont il peut y en avoir beaucoup:

<div class="options">
    <div class="opt1">
        <select title="Please choose Warranty">
            <option value="">Select Waranty</option>
            <option value="1">1 year guarantee</option>
            <option value="2">3 year guarantee</option>
        </select>
    </div>
    <div class="opt2">
        <select title="Please choose Color">
            <option value="">Select Color</option>
            <option value="1">Red</option>
            <option value="2">Blue</option>
        </select>
    </div>
    <div class="opt3">
        <select title="Please choose Size">
            <option value="">Select Size</option>
            <option value="1">Small</option>
            <option value="2">Big</option>
        </select>
    </div>
</div>

J'utilise cela dans Prototype qui a un support de sélecteur css3 presque complet, donc pas concerné par le support du navigateur.

Le sélecteur initial serait quelque chose comme:

div.options div select

J'ai essayé quelques variantes nth-childet je :not(:first-child)n'arrive pas à le faire fonctionner.

Voir: http://jsfiddle.net/uDvEt/1/

.options > div:not(:first-child) select { background:yellow;}

Vous devez sélectionner l'option divs au lieu de selects lors de l'utilisation :not(:first-child), car chaque selectest le premier (et unique) enfant de son parent div:

div.options > div:not(:first-child) > select

Une alternative à :not(:first-child)est d'utiliser :nth-child()avec un décalage de départ de 2, comme ceci:

div.options > div:nth-child(n + 2) > select

Une autre alternative est avec le combinateur général des frères et sœurs ~(qui est pris en charge par IE7 +):

div.options > div ~ div > select

.options > div:nth-child(n+2) select