CSS :: before,::选择器未在IE10中应用

时间:2015-02-10 21:13:15

标签: css css3 internet-explorer firefox pseudo-element

为什么IE10会忽略:: before,:: after规则中的所有规则?

查看开发工具,这些选择器中的每个规则都有一条直线,并且没有被应用。

有没有人见过这个?

打开这是Chrome / Safari,你会发现它有效。在IE10 + / FF中,它什么都没有显示。

http://codepen.io/anon/pen/qEpmKr

<input name="sex" class="sex_m" type="radio" value="Male">

input.sex_m[type="radio"]:after {
  content: "Male";
  padding: 9px 23px;
}
input[type="radio"]:checked:after {
  color: #222;
  border-left: medium none;
}
input[type="radio"]:after {
    border-left: medium none;
    font-size: 12px;
    vertical-align: top;
    color: #989898;
    padding: 9px 20px;
}
input.sex_m[type="radio"]:before {
    content: "M";
}
input[type="radio"]:checked:before {
    background-color: #F68B1F;
}
input[type="radio"]:checked:before,  input[type="radio"]:checked:after {
    border: 2px solid #F68B1F;
}
input[type="radio"]:before {
    font-family: FontAwesome;
    color: #FFF;
    font-size: 28px;
    background-color: #DEDEDE;
    padding: 9px 10px;
}
input[type="radio"]:before, input[type="radio"]:after {
    display: inline-block;
    border: 2px solid #DEDEDE;
    line-height: 20px;
    visibility: visible;
    height: 45px;
}
input[type="radio"] {
    width: 150px;
    height: 45px;
    visibility: hidden;
}

0 个答案:

没有答案