Hide Table

Table + CSS

[pixelww]

Hi there..

Wondered if anyone knew how I can prevent a table from printing with a CSS style sheet.

I have given my TABLE an ID, just not sure how to type the {display: none;} feature.

THANKS!

- Wendy

[drbrain]

If you want to not print several features, the best way is to provide a class. Either way, the idea is the same.

<style type="text/css">
@media print {
#someid { display: none; }
.hideforprint { display: none; } /* as a class */
}
</style>

Be careful when linking with <link> since the default media type is screen. Specify media="all" to use the above method, or use media="print" with print-only rules.

[TheDoctor]

Be careful to check what you do in a variety of browsers.

I have had problems with @media print and IE 5.x (not) working together.

IE5.x seems to ignore the "print" restriction - so you don't see things on screen that you're merely trying to hide on the printed page. This also happens with a Mac version of IE.

Curiously, other people in this forum do not seem to have had a similar problem, so the proble may be a consequence of what I have specificlaly tried to do. So don't be put off.

My solution, if you need to know it, has been to hide @media print rules from IE5.x and Mac IE, so users of these browsers get the screen printed straight.

NN4 does not recognise @media print, but it ignores the rules, rather than applying them wrongly, so users of NN4 get the whole screen printed, hidden bits and all. (But NN4 users are like Hells Angels - only one percent of the total - so don't worry about them.)