MediaWiki - Change Common.css without affecting Print.css

Question

Is there a way to change MediaWikis CSS for all skins without affecting the printable-version-layout?

To make it more clear: MediaWiki has an own stylesheet for it's "printable version"-page (print.css). I don't want to have changes to the stylesheet made in common.css to appear on the printable-version-page too.

So, if I change the font-size for all "normal" wiki-pages, I still want to have the original font-size on the printable-version-pages.

Answer 1

Use following in your CSS:

@media print {
  .element-with-your-class {
    your style
  }
}

The "@media print" ensures that the styles you set within are applied when the page is printed. See this link for more information on media queries.

Answer 2

Use the media query @media screen to ensure it only works on the screen, like this:

@media screen{
  .selector{
    /*your styles here*/
  }
}

More info at https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries