-moz-appearance notwork properly in radio button

Question

I have this dropdown with radio button:

And when is clicked my dropdown change to this:

but in mozilla don´t change is like not style have:

My css is this(only put one style be cause is the same for the rest of element);

when is clicked the dropdown:

li:first-child input[type='radio']{
    -webkit-appearance:none;
    -moz-appearance: none;
    width:15px;
    height:15px;
    border:3px solid #6a706d;
    border-radius:50%;
    outline:none;
    margin: 0 13px -3px 0;
    /*box-shadow:0 0 5px 0px #6a706d inset;*/
    }

and this is when appear in the dropdown:

.status-1{
       -webkit-appearance:none;
       -moz-appearance: none;
    width:12px;
    height:12px;
    border:3px solid #6a706d;
    border-radius:50%;
    outline:none;
    margin: 0 13px -3px 0;
    }

Here is mi fiddle

Share your code by fiddle please.... – Frank W. Jan 15 '16 at 20:23 — Frank W., Jan 15 '16 at 20:23
i post my fiddle, thx for u support!! – victor Jan 15 '16 at 22:16 — victor, Jan 15 '16 at 22:16

score 0 · Accepted Answer · edited May 23 '17 at 12:25

0

Allright, i got it. This is not a element that you can change with firefox. The only way to do this, is to fake it like this: Fiddle

There have been previous questions on stackoverflow about this. Check Link

edited May 23 '17 at 12:25

Community

1
1

answered Jan 18 '16 at 15:58

Frank W.

777
3
14
33

Thanks, and Im sorry i just look like moz appareance none but not like the title of the link, the code work, i just need change the posicion of the new color cause is outside of the original radio – victor Jan 18 '16 at 16:13

-moz-appearance notwork properly in radio button

1 Answers1