Question

I am making a website for mobile devices and It will be fixed 480 pixels width but when I view it on my ipod I see a huge blank space on the right. how can I tell the mobile browser with html / css to show it like a mobile page? I tried

body{width:480px}

and it didn’t work

Answer 1

Add this meta tag to your page: (do not use the maximum-scale=1 part that many popular ones contain. Zooming is required by some people no mater how nice your page is.)

<meta name="viewport" content="width=device-width, initial-scale=1.0">

and then you need your mobile layout to be 100% width instead of a fixed width, there are far to many devices with different sizes. Also NEVER check user agent… Ever.

body{ width:100% }