iPhone rotate document width issue

[alexmccabe]

Now before I go ahead and explain the issue, I have Googled, and forum trawled and I cannot for the life of me find an answer to this.

When I first load the website on the iPhone (Chrome or Safari) the website is great. No scroll other than vertical. Great.
[Screenshot here of how it should look](https://dl.dropbox.com/u/15262944/Iphone%20fail/Photo%2009-01-2013%2011%2033%2046.png “No horizontal scroll, sweet”)

When I switch to horizontal, it again behaves as it should. [Horizontal looks good too.](https://dl.dropbox.com/u/15262944/Iphone%20fail/Photo%2009-01-2013%2011%2033%2055.png “Horizontal looks good too”)

Now, switch back to vertical. This is where the fail happens. The document width does not scale back, and stays at the horizontal width (in both Chrome and Safari). [And now the site fails](https://dl.dropbox.com/u/15262944/Iphone%20fail/Photo%2009-01-2013%2011%2034%2001.png “FAIL”). So now there is horizontal scroll.

I have these meta tags currently

But they do not work.

Is there an actual solution to this?

[Andy Howells]

It’s a bug with iOS safari, the only way to cure it is to use max/min viewport scales.

However, I’d recommend that you don’t use those as they make it impossible for people to zoom on text etc, which is bad for those with visual impairments.

Ultimately, there is no cure that I’ve found for this and it’s best to just move along and ignore it, after all it’s not that hard for people to quickly zoom out, not everything is in your control.

[Author]

Posts