Jordan M.
Jordan M.

Reputation: 21

CSS Media query works on desktop, not on iPhone

I've researched this question and tried to solve it on my own for hours, to no avail. Hoping one of you can help. I am using this media query for the style I want on a desktop browser:

@media all and (min-width: 320px) {}

And I'm using this media query for the style I want on mobile browser:

@media screen and (max-width: 320px) and (min-width: 0px) {}

When I drag the desktop browser to less than 320px, the style changes accordingly. But when I bring up the website on a mobile browser, it displays the desktop style. What am I doing wrong?

Upvotes: 1

Views: 1092

Answers (1)

Kai Feller
Kai Feller

Reputation: 663

You need to include this meta tag:

<meta name="viewport" content="width=device-width, initial-scale=1">

Hope it helps!

Upvotes: 3

Related Questions