How to style a radio button?

Question

I simply don't find any instructions how to style a radio button like the div in my example here: http://jsfiddle.net/Q5SRe/

The div:

div { 
    width:50px;
    height:50px;
    background-color:green
}

also I would like that when the radio button is selected it has:

border: medium solid #000;

Answer 1

Radio buttons are part of the Shadow DOM, which as of yet can't be universally styled across browsers.

The best way currently to get custom radio buttons is to use images or the checkbox hack.

Answer 2

I have used this before, it is not cross browser compatible and I would recommend you keep things simpler, but that depends on your personal choice and use case