Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Jul 2002
    Location
    ...somewhere out there in the ether...
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts

    footer that prints but doesn't render?

    Is there an easy way to insert a line of type (say contact information) that would print but doesn't render or show onscreen?

    I've tried making the text the background color, but of course a light background means while you don't see it onscreen, you also don't see much of it when printed as it's light grey (on a b/w printer) rather than black.

    TIA!

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    In the <head>:

    Code:
    <style type="text/css">
    .printOnly { visibility: hidden; }
    @media print { .printOnly { visibility: visible; }}
    </style>
    In the <body>:

    Code:
    <div class="printOnly">
        This won't show on the screen but will print.
    </div>

  • #3
    New Coder
    Join Date
    Jul 2002
    Location
    ...somewhere out there in the ether...
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Wow - that was fast!
    Is it safe to assume this won't conflict with my present external CSS file?

    Many thanks!

  • #4
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    It'll only conflict if the class name conflicts. Of course you could always add the new class to the external file instead of the single document.

  • #5
    New Coder
    Join Date
    Jul 2002
    Location
    ...somewhere out there in the ether...
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hmm.. very strange results once implemented - Rats!

    In IE 5.0, type is correctly invisible, but fails to print.

    In Netscape 4.x, type prints, but unfortunately also remains visible on screen.

    For the sake of troubleshooting, here's my code copied from files in question, and pasted here.
    From the header:
    ----------------------------
    <style type="text/css">
    .printOnly { visibility: hidden; }
    @media print { .printOnly { visibility: visible; }}
    </style>
    ----------------------------

    From the <body>:
    ----------------------------
    <div class="printOnly">Mytext</div>
    ----------------------------

    Can you elaborate on the "@media" bit?

    Thanks again!

  • #6
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    If this needs to support Netscape 4 then you might as well forget it entirely. It's simply not possible in Netscape 4. With Netscape 6 (or other Gecko based browsers) it should work fine and I've done the opposite of what you asked in IE 5 as well so I'm not sure why it's not working. I can't test it in IE 5 now since I have IE 6 instead (grumble, grumble MS and their too tight integration with the OS). FWIW, it worked fine in IE 6 when I put it into a sample page.

    For the official notes on @media: http://www.w3.org/TR/CSS2/media.html


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •