How to import printing stylesheet using @media print query?

css, import, media-queries, printing

Solution

`@import` supports media types and media queries on its own, so you would pass the media query into the `@import` statement rather than nesting it in a `@media` rule:

@import "print.css" print;

Furthermore you cannot add an `@import` statement to style rules, so in this case you would need to put it all the way on top. If you cannot do so for cascading reasons, you cannot use `@import`; you need to include the print stylesheet using a `<link media="print">` element or similar instead.

Problem

I want to move my printing stylesheet into a seperate file to be imported using @media query. I tried the following, but it doesn't seem to work, at least on Chrome: ``` h1 { .... } .... @media screen { .... } @media print { @import "print.css"; } ``` How can I do it?

Original source

Related problems