单选按钮圆形镀铬,但在firefox中正方形

时间:2014-12-02 18:28:59

标签: html css google-chrome firefox

正如标题中所述,CSS和HTML中的所有内容都是相同的,但出于某种原因,firefox将单选按钮显示为方形。

如果您在Chrome中打开http://jsfiddle.net/u2yq3j50/4/,则单选按钮会显示为圆圈。如果您在Firefox中打开它,它将显示为正方形。

我已在-moz-appearance: radio;中尝试了#radio-demo input[type="radio"] + label:before,但这并未提供所需的输出,因为它只是覆盖了我的样式并使其无法选择。

任何提示都会很棒,谢谢!

1 个答案:

答案 0 :(得分:1)

基础知识第一:

-webkit-border-radius: 10px;
border-radius: 10px;

检查出来:

jsFiddle

我有时与浏览器兼容性如此紧张,以至于我忘记了所有未加前缀的版本。 Here's an "ok" website它生成基本的css3代码,然后您可以为其他浏览器添加前缀