HTML5 Webapp too wide on iPad with iOS7?

I ran into a very nasty issue with iOS7 on an iPad today: My webapp would render way too wide, causing scrollbars, where it would fit perfectly on older iOS versions.
Turns out that the culprit is in the meta-viewport tag.
This is what I had:

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

This is what it needs to be to make it work on iOS7:

<meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=0"/>

All you need to do is remove the width parameter. Makes total sense right? Not 🙂 But it works!

Leave a Reply

Your email address will not be published. Required fields are marked *