March 31st, 2003, 02:40 PM
Printing with CSS
This is really annoying:
I have a page which is made up of two columns, the first contains info I don't want printed, the second contains info I do want printed.
The trouble is, the table is set at 780px wide and the first column is set to 194px wide. I can hide the first column but when I print the page the column with the content in it runs off the page and there is a large gap left by the 1st column.
Ideally I would like to have all the content in the 2nd column visible when I print.
I've tried using divs to prevent it displaying but nothing seems to work.
If I could put div tags around the actual content and disregard everything else that would be great.
Can anyone think of a way to do this or any other workaround?
Last edited by Gareth; March 31st, 2003 at 02:45 PM.
March 31st, 2003, 02:55 PM
Is this for personal use or is this an app that other people will use too?
If it's for personal use, your printer should, if it's relatively new, have a setting to fit all content to the page.
If it's an app, can't you just make a print button that opens a new window with just the info from the 2nd column. Not a efficent solution, but it works. It would be nice if the info was pulled from a db so you wouldn't have to re-write it.
Other than that, nothing comes to mind immediately. I don't understand how you were using the div tags to print thou. If you were hiding the first column with div tags, why is it there at all?
April 2nd, 2003, 12:09 AM
<--- removed incomplete post --->
Last edited by Phil_work; April 2nd, 2003 at 12:15 AM.
April 2nd, 2003, 12:13 AM
if your columns were laid out using CSS positioning and you had two different ID's control each DIV in your print stylesheet you could hide one and display the other, by using a different print CSS file, that only is invoked on print of the page.
Set up your page like this.
<link rel="stylesheet" title="default style" href="1.css" media="screen">
<link rel="stylesheet" title="printer style" href="1.css" media="print">
I want to hide this content on print
I want to print this content
on the other hand you could give your table cells an ID or Class,
ID if there is only 1, class if there is mulitple.
CSS: Note that your CSS selector will also have declarations controlling the position of those elements.
prolly confused the hell out of you, hope not though