iPhone Safari iOS Zoom on Text Field

I was experiencing an issue where Safari on iOS iphone would zoom in on text fields as shown in the image below.

Safari iOS on iPhone zoomed in when text field was touched.

The fix was found on Stackoverflow’s “Disable Auto Zoom in Input “Text” tag – Safari on iPhone” article as well as on Warren Chandler’s “Preventing iPhone From Zooming” article.

Put simply, you either need to update your css so that the text size is greater than 16px AND the “select:focus” is set to 16px:

input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
select:focus,
textarea {
  font-size: 16px;
}

OR update the header meta tag so it disallows the zoom entirely:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

Afterward, the textfields no longer zoom in:

iOS iPhone text fields no longer zoom in after the fix.

Is this helpful?

Posted in

Toby Cryns

RSS From Toby’s Blog

  • “Now THAT was a good meeting!”
    A single effective meeting can change the course of history for a company. Imagine if you could lead effective meetings EVERY DAY! You can, but it takes curiosity & practice. This article is a good place to start your journey to a more effective you.
  • Never Respond to RFPs & Custom Proposal Requests
    Y'all who work at normal 9-5 jobs don't need to deal with the B.S. that is an RFP process (or rather you get paid to deal with it). But us freelancers gotta deal with a whole big bag of schtuff when it comes to custom proposals. Here's my quick-and-dirty RFP filtering process that I use […]
  • What content should I put on my homepage?
    I see websites as one stop of many on the sales journey, useful to help get customers from Point A to Point B in the sales process (or maybe from Point D to Point E).  If you are wondering about what to put on your homepage, start with these basic sales-related questions: Who, specifically, will…

More posts from themightymo.com

Unsummit Minneapolis

By | March 7, 2009

Today I will be liveblogging from the Unsummit (un)conference in Minneapolis. So far, I have bumped into all sorts of superstars from the local blogging and online social media scene, which is always fun.  I am looking forward to attending: “Launching a Startup in Your Spare Time” “Getting Good Ideas When Ideas are Tough” UnPanel…

Mark Gason Papervision 3D Presentation at FlashMN

By | February 18, 2009

I am liveblogging from Mark Gason’s presentation at FlashMN. These are my notes. Check out Mark’s page of resources.  It contains links to tutorials as well as all sorts of other Papervision 3D-related stuff.  http://gasolicious.com/flashstuff/PV3D_presentation.html Swift 3D is better than Papervision 3D in some ways: – You can model in Swift 3D, but AutoCAD also…

Reorganize Your WordPress 2.7 Admin Panel with Fluency 2.0

By | February 6, 2009

Yesterday I discovered the new Fluency 2.0 plugin for WordPress 2.7.  It does a fantastic job of cleaning up the admin interface and makes the back-end WordPress experience much better for users.

RSS From Toby’s Blog

  • “Now THAT was a good meeting!”
    A single effective meeting can change the course of history for a company. Imagine if you could lead effective meetings EVERY DAY! You can, but it takes curiosity & practice. This article is a good place to start your journey to a more effective you.
  • Never Respond to RFPs & Custom Proposal Requests
    Y'all who work at normal 9-5 jobs don't need to deal with the B.S. that is an RFP process (or rather you get paid to deal with it). But us freelancers gotta deal with a whole big bag of schtuff when it comes to custom proposals. Here's my quick-and-dirty RFP filtering process that I use […]
  • What content should I put on my homepage?
    I see websites as one stop of many on the sales journey, useful to help get customers from Point A to Point B in the sales process (or maybe from Point D to Point E).  If you are wondering about what to put on your homepage, start with these basic sales-related questions: Who, specifically, will…