Can I style an html radio button to look like a checkbox ?

it's completely achievable in Firefox 1+, Chrome 1+, Safari 3+ and Opera 15+ using the
CSS3 appearance property:

input[type="radio"] {
    -webkit-appearance: checkbox; /* Chrome, Safari, Opera */
    -moz-appearance: checkbox;    /* Firefox */
    -ms-appearance: checkbox;     /* not currently supported */
}

<label><input type="radio" name="radio"> Checkbox 1</label>
<label><input type="radio" name="radio"> Checkbox 2</label>

The result is radio elements that look like checkboxes.

Demo

One Other Demo





Web standards is the present and future in web design – the way all websites should be design and implemented. Websites created using web standards load faster, have better search engine ranking and are easier to update. All the websites I show here have been created this way.