The Viewport Meta Tag

<meta name="viewport" content="">

Within the content=" " you can enter a load of comma delimited values, but were going to to focus on the fundamental ones for now.

For example, if your mobile design is purposely laid out at 480px you can specify the viewport width:

<meta name="viewport" content="width=480">

For flexible layouts its more practical to base your viewport width on the device in question, so to match your layout width to the device width youd enter:

<meta name="viewport" content="width=device-width">

To be extra certain that your layout will be displayed as you intended it you can also set the zoom level. This, for example

<meta name="viewport" content="initial-scale=1">

will ensure that upon opening, your layout will be displayed properly at 1:1 scale. No zooming will be applied. You could even go further and prevent any zooming by the user:

  <meta name="viewport" content="maximum-scale=1">