Question

Basically I have a site at the moment that is width 940px, at the moment I just need this site to be viewable on iPad whilst I begin adding in media queries to tailor the site for each device. Is there a meta tag I can use so that my site scales down when on iPad?

Answer 1

I would use this:

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1" />

See developer.mozilla.org/en/Mobile/Viewport_meta_tag/.

It sets the width and height to the device’s width and height, sets the initial zoom to 1, and the maximum zoom to 1 (therefore making the page not zoomable).

EDIT: If you want the page to still be zoomable, remove maximum-scale=1:

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1" />