Remix.run Logo
scary-size 5 days ago

I can zoom just fine on mobile Safari.

PKop 5 days ago | parent [-]

So what?

His complaint is easily verifiable, and valid:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,user-scalable=0">

aitchnyu 5 days ago | parent [-]

I jumped on this bandwagon long back for preventing horizontal scrollbars and other issues. Is there an updated advice for allowing zoom and being responsive?

ericrallen 5 days ago | parent | next [-]

“Allowing zoom” and “being responsive” are not two states at odds with one another.

Preventing zooming is a serious accessibility issue and it makes the content worse for every user.

If you’re properly setting responsive widths, a large enough base font size, large enough input text size, and using border-box for box-sizing, things should just work except for cases where you’re absolutely positioning things or telling them not to word wrap and they are wider than the viewport.

lobsterthief 5 days ago | parent | prev [-]

There really is no bandwagon to jump onto here—most sites don’t prevent zooming in. Many that do were just misconfigured from the start, and because some popular mobile browsers ignore `maximum-scale=1.0`, the issue isn’t normally identified.

Quick tip: Make sure all of your inputs are at least 16px font size. This will prevent most mobile browsers from “automatically” zooming in when an input is focused ;) Which is a common reason people employ the maximum-scale property.