css - Why does `not (some-width: Xem)` media query never fire? -


i'm trying negate max-device-width media query (the reason don't won't both (max-device-width: x) , (min-device-width: x) fire if device has precisely width). unfortunately, not (min-or-max-some-width: x) media queries never fire.

here's a small fiddle. expect 2 yellow lines on desktop , 2 red lines on mobile. 1 yellow line on desktop (the last one) , 1 red line on mobile (the first one).

what doing wrong?

when using not (or only) in media query, need specify media type in order media query valid. seems strange, that's how grammar defined (see media_query production).

if media type not important, use all:

not , (max-device-width: x) 

updated fiddle


Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

Python ctypes access violation with const pointer arguments -