When you visit a webpage on your phone (I am using Android) if its a regular page it shrinks it to fit in your phone screen.
I always assumed the way to make a mobile page were to make the page small enough to fit completely in the phone's screen resolution without shrinking.
This is not happening though. I even specifically set my page size to body{ width: 300px;}
, still when I load it in my phone it is shrunk in the top left corner with plenty of free space around it.
What am I doing wrong?
You need to use viewport meta tag
<!doctype html>
<html>
<head>
<title>Hello world!</title>
<meta name="viewport" content="width=device-width"/>
</head>
<body>
<p>Hello world!</p>
</body>
</html>
Read in detail here http://davidbcalhoun.com/2010/viewport-metatag
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With