Thursday, September 8, 2011

Checkbox/Radio button size on Android Safari

You cannot change checkbox/radio button width/height on Android in Safari because it is tied to the OS.

But since the default ones are so tiny that you may need bigger buttons.
Here is a simple trick:

input[type=checkbox] {
-webkit-transform: scale(2,2);
}

Please note that if you set up values bigger than ~2 then the yellow outline will look weird.

2 comments:

  1. Thanks, this helped me out a bunch! I set mine to 1.5 and the size is great. I also added the following to the css to space them out more as well.

    label {
    display: inline-block;
    height: 30px;
    }

    ReplyDelete
  2. On how many occasions have you tried those customary software programs and failed to get that result that you were waiting for? Difficult to remember as you did encounter it for many a times? Well, it's the time to jump in joy! With the arrival of custom software development services providers, you can get your required software design and developed the way you want it, the way your business needs it.
    driver toolkit key

    ReplyDelete