The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Media Queries for desktop and iPad Re: Media Queries for desktop and iPad


have you tried setting a minimum and maximum width? Also, your last CSS declaration is wrong, it should be:
“@media screen and (max-width: 767px) and (device-width: etc”)
but you wrote “or”.
I don’t particularly like the meta viewport tag, it doesn’t work as great as everyone like us to believe. Actually I found it to be worthless at best.

try setting a min and max width:
@media screen and (min-width: 300px) and (max-width: 767px) {
This worked fine for me, and my sites render on everything, although there’s alot of extra coding to do since there are alot of different phones with a lot of different resolutions. I gave up trying to code for them all. Also, none of the emulators or simulators will work at all, in fact they can’t for the simple reason that a pixel on your laptop or desktop monitor is not the same size as a pixel on a smart phone. You need to actual device to see if what you are doing is actually working.