Print

* When designing a website, it is important to consider creating a CSS style for print media.
* Browsers already have built in support to seperate screen CSS from print CSS.
* However if the designer has created a seperate style sheet for print media then you may see a completely different outcome when you print a page.
* The purpose of this is to optimise our style sheets for print media content.
* If your website contains information that would regularly be printed by the user then you should include a style sheet for printed media.
* There are two ways of doing this:
METHOD 1
Create two CSS documents - one for screen CSS and one for print CSS - and link them both to your HTML document (inside the link tags you would have media="screen" for the first one and media="print" for the second one).
NB: We can specify more then one form of media for a single style sheet by having either media="screen, handheld" or media="all".
METHOD 2
Create the styles with embedded CSS by having @media screen / @media print / @media screen, print as your selectors - as you would expect, styles for screen only go in the first set, styles for print only go in the second, and styles for both go in the third.
* 3 tips for optimising your document for print.
1. font-size: use ems or % for screen, use points for print (1em or 100% = approx. 11 or 12pts)
2. page width: if your site has a fixed width it doesn't translate well to browsers when they print it (can be shrunk or cropped) so for print media set the width to 100%.
3. remove menus: when printing a web page, the menu systems are just a waste of ink so remove them by adding the rule #menu {display:none;}