I have two radio buttons, I need to set the background color on click. My code works in all browsers except for IE8. Is this possible to get this to work for IE8 without the use of 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/
The :checked CSS pseudo-class selector represents any radio ( <input type="radio"> ), checkbox ( <input type="checkbox"> ), or option ( <option> in a <select> ) element that is checked or toggled to an on state.
The checked selector is used to select all checked elements in input tag and radio buttons. This selector is used with radio buttons, checkbox and option elements.
The answer is no.
While IE8 understands adjacent sibling selectors, it doesn't understand the checked
pseudo-element, so, unfortunately, you can't make your code IE8-friendly by using CSS only.
Take a look at Selectivizr or IE7.js for a JavaScript solution.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With