Search code examples
cssmedia-queriescssnano

cssnano removes "all" attribute from css @media query


I am curious if what cssnano does to media queries is ok. In my css file, I have.

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

After running my css through cssnano, it turns it to this >

@media ( min-width: 600px) {}

Is this safe to use in production? I can't seem to find anywhere where it says not having the "all" attribute makes the browser default to all or if not having it is a bad thing for sending the file to production?


Solution

  • I'm the author; yes, it's valid. I'll refer you to the original issue but in a nutshell:

    Per the spec (example 5):

    I.e. these are identical:

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

    As are these:

    @media (orientation: portrait) { … }
    @media all and (orientation: portrait) { … }
    

    It seems to me that those could be stripped...[snip]

    https://github.com/ben-eb/cssnano/issues/215