Entry

using media="print", how can I 'hide' a layer so as not to print?

Sep 19th, 2002 05:37
Mason Womack, Wayne Feltham,

Hi, I was also having this problem for a while and methods that work in 
IE don't always work in NN.  I have found the following method to work 
on Netscapes across operating systems, but have not tested in IE yet. 
(I have been told it is OK though.)

1) Create a style sheet specifically for printing media and apply it to 
the page in the same way as other external style sheets, even when 
other style sheets are also called.  Call it something like "print.css".

2) In the style sheet, create a class called .hide or something 
similar.  Define this class in whatever way is suitable to your 
purpose, but to simply hide information, just set the "display" of the 
class to "none".

3) In your document, add this class definition to anything you do not 
want printed.

Code would look something like:
1) in the style sheet:

 .hide {
 display : none;
 }

2) in the header:

<link rel="stylesheet" type="text/css" href="[path to]print.css" 
media="print">

3) in the document body:

<div class="hide"><p>Example: This will not show up on print</p></div>
-or-
<input type="button" name="print" value="Print" class="hide">
etc.

I use this to hide two functional buttons on an html page designed for 
printing.  It took many tries to get it working, but seems fine now.  
Good luck and happy coding!

-Mason