Media request for galaxy s2

Question

I developed a responsive theme for my website Using media queries in my css file.

It works great on ipad / iphone and small Android phones. When I get to Galaxy S2, it seems to ignore my media queries.

This is an im media query using target galaxy s2 and also - is this correct? if so, why doesn't it work?

@media only screen and (min-device-width : 480px) and (max-device-width : 800px) 

thanks

Answer 1

Your code should work.

You tried to add an "orientation" like:

 @media only screen and (min-device-width : 480px) and (max-device-width : 800px) and (orientation : landscape) { } @media only screen and (min-device-width : 480px) and (max-device-width : 800px) and (orientation : portrait) { } 

Answer 2

The answers shown are incorrect! Samsung devices do not have the same resolution in both portrait and landscape modes, as Apple devices do. Also, why are you using min-device-width and max-device-width? Stick to permission! You do not want your design to display improperly with the wrong resolution! Do this, I guarantee that it works, because I use it all the time:

@media screen and (device width: 480 pixels) and (device height: 800 pixels) and (orientation: portrait) {styles} @media and (device width: 800 pixels) and (device height: 480 pixels) and (orientation: landscape) {styles} Drop the "only" rule! It's not obligatory! Use only pocket or screen values.

Answer 3

It may also be useful: @media all and (device-aspect-ratio: 3/5) .

Information taken from: http://cssmediaqueries.com/

Answer 4

Galaxy S2 has a device pixel ratio of 1.5, so media queries should be:

@media screen only and (min-device-360px width) and (max-device-width: 533px)