CSS Bigger Element Without Breaking Existing UI Framework

-webkit-transform: scale(2);

Let’s say we want to make the checkboxes in table bigger.

If we just use width and height, yes the size will change, but also break the UI framework, e.g., Bootstrap.

So maybe we should use transform with scale instead.

td input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(2); /* IE */
  -moz-transform: scale(2); /* FF */
  -webkit-transform: scale(2); /* Safari and Chrome */
  -o-transform: scale(2); /* Opera */
}

Reference

How can I change the size of a Bootstrap checkbox?