Beware the difference between Mobile Screen Resolution & Browser Window Resolution
Can others confirm this?
I have an HTC Desire 310 which has a screen resolution of 480 x 854 pixels. I created a test site with the following variants
Main 960 px
v1 720 px
v2 480 px
v3 240 px
When viewed on my desktop the break points 360, 600 & 840 worked as expected as I reduced the browser window width.
However on my HTC, in portrait, instead of viewing the 480 variant it servered up the 240 variant.
When I rotate to landscape I get the 480 variant, not the 720 variant.
On non desktops and laptops, there is a large difference between the browser window size and the stated screen resolution.
This holds equally true on my iPad4.
I'll attach my test xar file and you can test it on your other devise live here.
Just watch the Variant Size Header.
There is a small Javascript in the <head> that displays the browser window resolution in an alert. You need to hit Refresh as you test the portrait/landscape modes.
Link to live example
Reply With Quote
Bookmarks