CSS Media Query applies out of range

Question

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 1

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, initial-scale=1" />