Input checkbox ridiculously big on iOS Safari

Question

Checked my site on iOS Safari and I get this huge checkbox input that looks like it's system styled. Can this be styled, or maybe made a bit smaller?

The issue can be checked here

Answer 1

With CSS Grid I had to add width and height and line-height to input.

Answer 2

The Hoffman's solution doesn't work for my website, but this addons in the css does:

@supports (-webkit-touch-callout: none) { /* CSS specific to iOS devices */ input[type=checkbox] { -webkit-transform: scale(0.5,0.5); } }

Answer 3

Set the padding of the checkbox to 0 (or to a value more to your liking).

.gdlr-core-input-wrap.gdlr-core-large input:not([type="button"]):not([type="submit"]):not([type="file"]) {
  /* padding: 20px 22px; */
  padding: 0;
}