CSS for Printing – Printer Friendly Web Pages

You often find pages on the web that offer a special printer links that when you click,
pop up a printer-friendly formatted version of the web page you want to print.

An easier way to achieve this for yourself is to invoke the @media print command to your
stylesheet, which makes any part of the page that you prefer to leave out of the printed
version, invisible. You can also override any background images, and change font

sizes if you wish.

For example : adding this to the bottom of your stylesheet (obviously changing it to use
div class or id names . . .)


@media print {
body {font-size: 10pt; line-height: 120%; background: white; width:900px;}
.header {display:none}
.footer (display:none)
.navigation {display:none}
}