Why is my Android device-width 980px?

Question

I am confused. I am trying to make a website responsive by playing around with media queries.

according to most sources, for example this, the mediq-query to use for

Answer 1

You might want to try using max-width instead of max-device-width. It could well be a pixel-density thing - max-device-width might be reporting device pixels instead of CSS pixels.

Here's a test page:

• http://jsfiddle.net/56XhE/

To really get a handle on this, you'll want to read Peter-Paul Koch's "A Tale of Two Viewports":

• http://www.quirksmode.org/mobile/viewports.html
• http://www.quirksmode.org/mobile/viewports2.html

And possibly his recommendation on doing CSS for mobile devices:

• http://www.quirksmode.org/blog/archives/2010/09/combining_meta.html