Tips and Tricks for iOS Safari Input Fields

Tip #1: Input Font Size

Have you ever noticed that when you focus on an input field on iOS Safari, the site zooms in? This is because if the font size is smaller than 16px, the browser will zoom the whole site in until the text size becomes at least 16px. To avoid this, make sure to set the font size to 16px or larger.

Tip #2: Input.focus() Doesn’t Show Keyboard

If you’re trying to open the keyboard on iOS Safari by focusing on an input field using the simple inputEl.focus() method, you might be disappointed to find that it doesn’t work. Unfortunately, there aren’t any straightforward solutions for this issue, but you can check out some hacks on Stack Overflow to work around it. It’s frustrating that we have to resort to hacks, but until iOS Safari fixes this issue, it’s the reality we have to live with. Who knows, maybe Safari is becoming the new Internet Explorer! 😄