Jump to content

Recommended Posts

[!--quoteo(post=364005:date=Apr 12 2006, 08:48 AM:name=paulspoon)--][div class=\'quotetop\']QUOTE(paulspoon @ Apr 12 2006, 08:48 AM) [snapback]364005[/snapback][/div][div class=\'quotemain\'][!--quotec--]
I hope that some one can show me some code on how to remove the following from a page that a user [b]prints[/b] : "The heading", "Page 1 of ?", "the webaddress in the footer" and "the date on th bottom right"

I'm currently using css but am quite new in it.

All help appreciated
Regards
[/quote]

ok, there are two steps to hiding things during printing... first, you need to declare a print and a screen style sheet (so, you'll actually have two for your site). they can be identical, or as different as you'd like, but the key is this: on the print stylesheet, you need to put those elements tha you want hidden as "display: none;"

so, for instance, if i wanted to create a class to hide elements form a print layout, i'd do something like this:

PRINT CSS:
[code]
.hideForPrint {
  display: none;
}
[/code]

now, for all intents and purposes, your regular screen CSS could be identical, but you DON'T want the above class in it. that really could be the only difference in them. then, you need to call them both in your page and tell the browser how to use them like this:
[code]
<link type='text/css' rel='stylesheet' href='screen.css' media='screen' />
<link type='text/css' rel='stylesheet' href='print.css' media='print' />
[/code]

notice the "media" attribute. this is what tells the browser which one to use for screen vs. print.

now, all you have to do is apply the class of "hideForPrint" to any elements you want to disappear when you print, and you'll be set to go.

hope this helps
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.