Responsive web design – thoughts upon pixels

[Historical Forums User]

Hi. I recently read Ethan Marcottes book Responsive Web Design. It was a very good book with a lot of new to think about.

The thing is when he uses media queries for mobile devices, he says all the time that I should use max-width: 320 px or 480 px for landscape mode. And he also uses iPhone for most of his examples.

What I don’t get is that iPhone has a resolution of 960 x 640 pixels. Can I really use @media screen and (max-width: 320px) for iPhone? I can’t use max-width: 960 px because that would ruin the experience for small desktop computers and tablets.

Or is it so that iPhone automaticly adjusts itself with the 320px statement?

Otherwise, what should I use, millimeters?

[Historical Forums User]

Well,, in the book he used iPhone 4. And that is why I started wondering

[tjkrusinski]

Also, a way to target the iPhone 4, you can use ‘min-device-pixel-ratio : 1.5’.

[Historical Forums User]

tjkrusinki, I guess that only targets iPhone? I want it to work for all mobile devices.

[Author]

Posts