One of our clients wants their website to print out on paper the way it looks on screen. I need to develop custom css for printing.
So after my main css is called, I add the call to the conditional css file like this:
link rel="stylesheet" href="_print_style.css" type="text/css" media="print"
then in the _print_style.css file, I hid certain elements that shouldn’t print, such as the navigational menu boxes with
.sbox {display:none;}
A big issue I found was that floating div’s do not print across pages; To fix this issue, I added entries for each floating div to my _print_style.css file like this:
#bbox {width:780px;float:none;}
A few other tweaks here and there, now all the information shows up nicely on the printed page without needing a special “printable version” of the webpage.