Come posso ottenere uno pseudo elemento css: selezionato per funzionare in IE8 senza Javascript?

Question

Ho due pulsanti di opzione, ho bisogno di impostare il colore di sfondo al clic. Il mio codice funziona su tutti i browser ad eccezione di IE8. È possibile ottenere questo funzionamento per IE8 senza l'uso di Javascript?

<form> 
    <input type="radio" id="m" name="gender" value="male"> 
    <label for="m">male</label> 
    <input type="radio" id="f" name="gender" value="female"> 
    <label for="f">female</label> 
</form> 

input:checked + label{ 
    background:red; 
} 

http://jsfiddle.net/chrimbus/sXjyL/3/

Answer 1

Mentre IE8 understands selettori di fratelli adiacenti, doesn't understand lo pseudo-elemento checked, così, purtroppo, non è possibile rendere il codice IE8-friendly utilizzando solo i CSS.

Dai un'occhiata a Selectivizr o IE7.js per una soluzione JavaScript.

Answer 2

Si può provare questo:

input[checked=checked] + label{ 
    background:red; 
}