how can I change width of a checkbox Without transform Scale

Question

I seem to strugle finding a way to change only the width of a checkbox. I know you can increase the scale with e.g. transform: scale(2); but I only want to increase the width let's say

#myCheckBox {
 width: 50px
}

Why doesn't this work?

Answer 1

Let's assume your HTML CODE is:

<input type="checkbox" name="checkBox1" checked id="myCheckBox">

So you can style your check box by this CSS CODE:

#myCheckBox {
  transform : scale(3,1); /*3 for width,1 for height*/
} 

NOTE : 1 value is the default value of scale