View Full Version : css to produce a print out

06-26-2007, 10:05 PM
hi guys i currently have a box that contains some text and i use the overflow:auto to keep the content inside.

i would some like to have a button.link that allows the user to press and it would produce a nice clean print out of the text.

at the moment when it prints it works by cutting of the text off.


06-27-2007, 12:47 PM
To produce a button to print the page I would attach some javascript.
Then add a separate print stylesheet to the page.

06-27-2007, 01:29 PM
Another way to do it without the js is to have two CSS style sheets (assuming external sheets) with a specific media type. One with the media type of "screen" and the other with the media type of "print". Both CSS sheets are attached to the page. When the viewer hits the print button the "print" css sheet with the media style is invoked. Can't remember the exact syntax for the header but if you Google css print you should be able to find it. (I believe it's MEDIA TYPE=PRINT, something like
<link href="CSS/global.css" rel="stylesheet" type="text/css" media="print"/>
) May be a little tricky since the text in a a scrollable area but this will give you a place to start.


07-24-2007, 07:21 PM
domedia is right, create a stylesheet specifically for the print media, and javascript to initiate the print action. If you're using dreamweaver, this is pretty straight forward.

07-25-2007, 12:47 AM
Great I would like to know this as well.
I look at my pages in print preview and yes they are pretty but the viewer doesn't need all on the page to print e.g. banners - lots of colours.