Responsive website appears zoomed in with iPad

问题:

It appears that when I access my website via the iPad (the newest gen) it loads the responsive site correctly starting in landscape mode. When I switch to portrait, I can see that the site adjusts properly and it also looks fine. It's when I switch back to landscape again that the site appears to zoom in a bit and needs to be zoomed out.

I have the following code in the page to try to combat this, but it still occurs...

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />

Any help is much appreciated!

回答1:

Seems it can be fixed by removing the initial-scale property, or alternatively by JS

Look here: Responsive site is zoomed in when flipping between Portrait and Landscape on iPad/iPhone

here: iOS zooming issue on responsive site from portrait to landscape break points

and here: http://opensourcehacker.com/2012/01/09/zoom-on-orientation-change-fix-for-mobile-browsers-mobilizing-websites-with-responsive-design-and-html5-part-8/