Question

I have a stylesheet that looks like this:

body{
 background: #333;
}
...


@media print {
 body{
  background: #fff;
  color: #000;
  font-size: 10pt
 }
 ...
}

the print styles work ok and are applied when you go in print preview mode in your browser.

However I have a “print” button on the site, which when pressed, outputs the current page in print mode (same page, but containing only the relevent info, no menus, sidebar etc)

How can I enable the print styles in this page? If I include the stylesheet it will style it as the other pages…

Answer 1

1. Create a print.css without the @media print part

2. Include it once in the header like so: <link rel="stylesheet" type="text/css" media="print" href="print.css">

3. Include it as regular CSS when you want to load the page in print mode.
   Put e.g. something like this in the header:

<?php
if ($_GET['view']=='print') {
 echo '<link rel="stylesheet" type="text/css" href="print.css">';
}
?>

That way it’ll be included when you load a URL like some_page.php?view=print as well as when you go into the browsers print preview window.