1

Coding a simple radio button generates a blue button

 <input type="radio" name="sample" />
 <input type="radio" name="sample" />

See http://jsfiddle.net/XytJC/2/

How can I make these red?

Thanks

Steve
  • 4,534
  • 9
  • 52
  • 110
  • 2
    You can't, unfortunately. – David Thomas Jun 12 '13 at 16:10
  • You can't*. It will display using the device/browser UI styles. * Well you can with something like http://www.inserthtml.com/2012/06/custom-form-radio-checkbox/ but it's better to stick with the defaults, in terms of accessibility etc. Note - this doesn't actually affect the radio button styling, it just hides the radio button and adds a clickable label over the top. – Nick R Jun 12 '13 at 16:10
  • 1
    Duplicate of [How do I change the color of radio buttons?](http://stackoverflow.com/questions/4253920/how-do-i-change-the-color-of-radio-buttons). You need JS and/or custom images. – Vilsepi Jun 12 '13 at 16:11

2 Answers2

2

At the moment it's impossible to make it appear in the same way across the all available browsers because of not fully supported CSS3 and HTML5. So what I suggest you, is to use a plugin Uniform.js to get what you are looking for.

But if you are asking this question, I would mention also, that you will need to achieve this by using the css sprite method. Here on This website you will find the corresponding documention of "how to..."

aspirinemaga
  • 3,753
  • 10
  • 52
  • 95
0

Try using a span, as explained here.

tsm
  • 3,598
  • 2
  • 21
  • 35