Take the 2-minute tour ×

I developed a web app for the iPhone which has a page with a textarea widget. When I begin editing the contents of this textarea widget Safari zooms in and makes the text really, really big. Now I can't see the document anymore, just a little postage stamp sized piece of it.

Are there any properties I can set which will keep mobile Safari from doint this? I just want the textarea font to stay the same size when I edit its text. Thanks.

share|improve this question
add comment

2 Answers

You can add:

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

to your HTML header.

share|improve this answer
This is fairly user hostile. Please do NOT prevent user zooming, either through maximum-scale=1.0 or user-scalable=no. –  Alan H. Jun 2 '11 at 5:13
Though for websites I could agree, this is a valid tip for situations where you want to really prevent user zooming. I believe you cannot universally state that this is bad for UX. It depends on the situation. –  Mosselman Jun 9 '13 at 9:40
add comment

You would need to set your textarea font-size to 16px and have an initial-scale of 1.0.

But if your app is not really designed for the iPhone, that is, if it’s essentially a normal web page that users should be able to scale, then you should probably just become okay with it. The worst thing to do to your users is show them 6pt text they can’t zoom, you know? Some of them won’t have perfect vision.

See also: Apple's list of all Safari/iOS special meta tags.

share|improve this answer
add comment

Your Answer


