仅将视口用于iPhone，不能用于iPad

Question

I'm using the following meta tag to display a site correctly in iPhone:

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

On iPad however, when using the meta viewport, the site is not correctly zoomed once loaded. Instead of showing the entire page, I have to scroll the right to see the hidden part of it. Everything looks perfect though if not the meta viewport is not used.

Is there a way to only use viewport for devices with width under 481px? Or is it possible to use CSS to archive what meta viewport does?

Answer 1

For iPhone:

<meta name="viewport" content="width=device-width; initial-scale=0.65; maximum-scale=1.0;">

For iPad:

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