1

Hello! I am trying to increase size of radio button using the below css, which works in mozilla but not in chrome.

.rdo
{
margin: 1em 1em 1em 0;
transform: scale(1.3, 1.3);
-moz-transform: scale(1.3, 1.3);
-ms-transform: scale(1.3, 1.3);
-webkit-transform: scale(1.3, 1.3);
-o-transform: scale(1.3, 1.3);
}


<input type="radio" class="rdo"/>

JSFIDDLE

Any Solutions?

Acelasi Eu
  • 914
  • 2
  • 9
  • 30
Nitin Varpe
  • 10,450
  • 6
  • 36
  • 60
  • possible duplicate of [How to change the size of the radio button using CSS?](http://stackoverflow.com/questions/4920281/how-to-change-the-size-of-the-radio-button-using-css) – mplungjan Dec 12 '13 at 13:52
  • Possible duplicate? http://stackoverflow.com/questions/4920281/how-to-change-the-size-of-the-radio-button-using-css – dowomenfart Dec 12 '13 at 13:52
  • 1
    lol @mplungjan we answered at the same time. – dowomenfart Dec 12 '13 at 13:53
  • The fiddle works fine in both browsers here. For reference, add a normal radio button too and look at the relative sizes. – Mr Lister Dec 12 '13 at 13:58
  • 1
    And I don't believe this is a duplicate. The other question asks: how can I style a radio button, and it didn't get an answer in 2011. This one asks: what is wrong with my transform property; the fact that it's about a radio button is a coincidence. – Mr Lister Dec 12 '13 at 14:02
  • If you follow the links given, you will for example see this page which shows a large radio in Chrome but also shows how poorly it works in other browwsers: http://www.456bereastreet.com/lab/styling-form-controls-revisited/radio-button/ – mplungjan Dec 12 '13 at 14:04
  • I don't think there is any way (certainly not *reliably*) to style radio or checkbox `input`, or `select`, elements; [there are alternative approaches](http://jsfiddle.net/davidThomas/r6HeL/1/), though, which are reliable to an extent (though their suitability depends on the cross-browser requirements). – David Thomas Dec 12 '13 at 14:29

1 Answers1

1

Styling radiobuttons and other inputs isn't cross-browser. Each browser can render it in different way. I advise to use some methods of customizing inputs, like this: link

Mihey Egoroff
  • 1,542
  • 14
  • 23