Question

I have an issue with my crossbrowser/cross-resolution CSS, so I had a look into media queries, and one of the issues is that WebKit based browsers seem to render the height differently to Gecko based browsers for some reason. (To be honest, this is probably to do with my terrible CSS skills)

Along side that, the WebKit browsers seem to render the height the same as what is required by a 1366×768 resolution.

So my question is: Is there a way of doing a media query just for webkit browsers AND a specific resolution?

Thanks!

Answer 1

Yes, you can write something like

@media screen and (min-device-pixel-ratio: 1.5) and (max-width: 480px) {...}

You can read about it here http://menacingcloud.com/?c=highPixelDensityDisplays