mask out nav for print with css?? [Archive]

Click to See Complete Forum and Search --> : mask out nav for print with css??

dropkick

05-05-2006, 07:49 AM

HI there,

I've just designed a site that has a print function on every page and the client has just come back and asked that when a page is printed the nav not be included in the print. I've been told this may be possible with some kind of CSS masking. Not sure if this is true though. Any ideas guys???

The whole site doesn't use frames or includes!
:confused:

Fang

05-05-2006, 09:59 AM

@media print {
#nav {display:none;}
}

dropkick

05-05-2006, 10:20 AM

cool but how would this code know what the nav is??

TheBearMay

05-05-2006, 10:54 AM

id="nav"

dropkick

05-05-2006, 11:49 AM

cheers I tried that by putting your code into the header like this

<script type="text/JavaScript">

</script>

but still seams to be printing out the nav and I have given the nav table it's id like this..

<table width="190" border="0" cellpadding="0" cellspacing="0" id="nav">

also the print button code looks like this..
<a href="#"><img src="images/print.gif" alt="print" width="14" height="11" border="0" onclick="window.print()" /></a>

Fang

05-05-2006, 01:31 PM

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Basic HTML</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script type="text/javascript">

</script>

<style type="text/css">
/* as the last rule */
@media print {
#nav {display:none;}
}
</style>

</head>
<body>
<table id="nav" border="0" cellpadding="0" cellspacing="0" summary="">
<tbody>
<tr><td>This will not be printed</td></tr>
</tbody>
</table>

</body>
</html>

dropkick

05-05-2006, 01:42 PM

thanks so much I really appreciate it. will give it a try now next week. ;)