单选按钮在Internet Explorer中无法正常工作/可选

Question

我有几个单选按钮，它们在Chrome，Firefox和Safari中运行得非常好，但在使用Internet Explorer（版本7）时，它们只是无法选择。我有什么想法可以解决这个问题吗？

HTML：

<label>
    <input type="radio" name="12" value="1">
    <span>12</span>
</label>

CSS：

label input[type=radio]{ position: absolute; top: -20px; }
input[type=radio]:checked + span{ color: #fff; background: #8dc63f; }

Answer 1

CSS 2.1选择器+在IE 7中不可用

http://caniuse.com/#feat=css-sel2

Answer 2

某些IE版本无法解析此CSS选择器：

input[type=radio]:checked + span

如果您确实需要这种行为，则必须使用Javascript在触发input[type=radio] change事件时执行这些样式更改。

Answer 3

IE9 +上可以使用:checked选择器（来源：http://net.tutsplus.com/tutorials/html-css-techniques/the-30-css-selectors-you-must-memorize/）。

Answer 4

您也可以使用DIV代替标签