Soluzione migliore per cambiare il colore dei bambini su hover genitore

Question

C'è una soluzione crossbrowser a una linea molto migliore per cambiare il colore del testo dei bambini tramite css?
bisogno di fare tutto rosso il testo al passaggio del mouse div

html:

<div><span class="gray">I'm a lion!</span><span>Arrrrr!!!</span></div> 

css:

div {color:black}; 
.gray {color:gray;} 
div:hover {color:red;} 

ho pensato solo che questa

div:hover, div:hover .gray {color:red;} 

Answer 1

il proprio ...

div:hover, div:hover .gray {color:red;}

... è buono una soluzione come qualsiasi, in realtà. Se vuoi abbinare anche altre classi/elementi puoi usare una stella;

div:hover, div:hover * { color:red; } 

demo http://jsfiddle.net/h5BaU/