Hi guys!
I’m working on making a site more responsive on smaller screens (such as the iPhone).
When I attempt to use a CSS Media Query like this one:
/*iPhone size*/
@media all and (max-width: 320px) and (min-height: 480px) {
/*style goes here*/
}
It won’t work.
Weirdly enough if I adjust the sizing to this:
@media all and (max-width: 480px) and (min-width: 360px) {
/*style goes here*/
}
(obviously that is not the size of anything, but it works oddly enough)
It will work and it will apply the style to the proper elements.
Any ideas? Is this because I’m testing in a desktop browser? Would it be different if tested it in a actual smart phone browser (obviously I’m resizing the browser to the correct size that I’m targeting).
Any help would be appreciated.
