Radio Button Style not working in Internet Explorer 8

css, internet-explorer-8, javascript, radio-button

Solution

the `:checked` pseudo class is not available in IE8

http://www.quirksmode.org/css/contents.html

http://www.quirksmode.org/css/enabled.html

I just show normal radio buttons in IE8 and lower. This gives people with old technology the same experience and doesn't burden you with hours/days of work just to have everything look the same across browsers.

Problem

I am having few radio buttons. I use the following css for changing the radio button style with an image. It works perfectly in firefox, chrome and even Internet Explorer 9 but not in Internet Explorer 8. ``` input[type='radio'] + label { margin: 0; clear: none; padding: 5px 0 4px 24px; /* Make look clickable because they are */ cursor: pointer; background: url(icons.png) left center no-repeat; background-position:0px -7055px; width:45px; height:20px; border:0px; cursor:pointer } input[type='radio']:checked + label { background-image: url(icons.png); background-position:-54px -7055px; width:45px; height:20px; border:0px; cursor:pointer } ```

Original source