PreFiXAUT PreFiXAUT - 13 days ago 5
CSS Question

CSS Media Query applies out of range

I'm using following media query:

@media (max-width: 1439px) and (min-width: 940px) {
...
}


The strange part about it is, that when I try it on my phone or with the chrome device emulation, it always applies. No matter how small the browser/emulation window is.

Answer

When you use media queries you must specify the type of media (screen)

@media screen and (max-width: 1439px) and (min-width: 940px) {...}

Second thing, you must include in your html this <meta>

<meta name="viewport" content="width=device-width" />