How to make print use desktop media queries?

Question

I am attempting to add some print functionality to my page, but I am having an issue where when I print, it is printing as if it is mobile. How can I make it so that when someon

Answer 1

You can add an @media print rule at the bottom of your stylesheet:

@media print {
  .visible-desktop {
    display:block;
  }
  .visible-mobile {
    display:none;
  }
}

Answer 2

only screen

This excludes print. If you want to include print, don't write that.

Answer 3

You should pick one state (probably desktop) and make it the "default", by moving that state outside media queries.

The other states should override the default state's properties in media queries.