I recently read Marko Dugonjić’s 10 Minutes to Printer Friendly Page (via CSS Vault), a quick tutorial on how to load a print CSS with server side scripting. The technique involves reloading the same page, but with an added variable to the query string. When that variable exists, a separate print stylesheet is loaded instead of the screen stylesheet.
What I usually do on client sites is very similar, but not quite the same. I also use server side scripting to check for a variable on the query string, but I don’t load a print stylesheet instead of the normal CSS file, which Marko does.
The way I do it, I always load the normal screen CSS. When the query string contains the printer-friendly variable, I also load an overriding print CSS. In the print CSS, I define rules that override those in the normal CSS that aren’t suitable for the print version. This includes setting
display:none for stuff that should be hidden, changing
margin, and anything else that needs to be changed to make just the content appear in a format suitable for printing.
There is no huge difference in doing it this way as far as I can tell, so it’s mostly a matter of preference which way you choose to define and load your print stylesheets.
Subscribe / follow
- Senior Front End Developer at Synacor, Inc. (Buffalo, NY, Ne, US)
- Senior Java Developer at Synacor, Inc. (Buffalo, NY, Ne, US)
- Programmer / Software Developer / Back-end Developer at Caxiam Group (Orlando, FL, Fl, US)
- Front End Designer & Developer at Mission Data (Anywhere in the US with travel to Louisville, KY and Washington DC, Il, US)
DreamHost web hosting
Use the promo code 456BEREASTREET3 to save USD 20 when you sign up for DreamHost