#StackBounty: #css3 #responsive-design #smartphone #screen-size RWD and smartphone's screen x browser window size

Bounty: 50

I’m developing a site with Responsive Web Design (RWD). I decided to use 640 pixels as the breakpoint between mobile and desktop, as this site appears to do (as can be seen when resizing the browser on PC). However, when using this site to measure the screen in my smartphone, I get the following properties:

Browser window size: 980 x 1392
Screen size: 360 x 640

Somehow the browser window gets much bigger than the screen, and the website appears as if on a desktop. It seems I need Browser window size to be about the same as Screen size, so that the “small version” of the site appear on the smartphone. How do I achieve that?

EDIT

After I added

<meta name='viewport' content='width=device-width, initial-scale=1'>

to the code, the page appeared correctly in the smartphone’s browser. However, I still don’t understand why browsersize.com returns a browser window size so larger than the screen size.


Get this bounty!!!

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.