1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Creating a Printable Stylesheet

Discussion in 'CSS' started by Funky Monk, Feb 8, 2005.

  1. #1
    I've created a Stylesheet to create a 'Printer-Friendly' page, which strips out all unwanted IDs and DIVS from the print page. Everything is OK, except that it doesn't remove the DHTML navigation menu.

    The print.css stylesheet is as follows:

    #body{ background-color:#FFFFFF; background-image:none; color:#000000 }
    #latestNews{ display:none;}
    #header{ display:none;}
    #header2{ display:none;}
    #horizontal_rule{ display:none;}
    #sidebar{ display:none;}
    #sidebarRight{ display:none;}
    #footer3{ display:none;}
    #anchors{ display:none;}
    #dhtml_menu{ display:none;}
    #mainContent{ width:100%;}

    The code on the page, with the 'offending' item as marked in red:

    <link rel="stylesheet" type="text/css" media="print" href="stylesheets/print.css">

    <!-- end of printable version stylesheet -->
    </head>
    <body onload="setStyle();" >
    <!--- main DHTML navigation script starts -->
    <script language="JavaScript" type='text/javascript'>
    //HV Menu- by Ger Versluis (http://www.burmees.nl/)
    //Submitted to Dynamic Drive (http://www.dynamicdrive.com)
    //Visit http://www.dynamicdrive.com for this script and more

    function Go(){return}

    </script>
    <div id="dhtml_menu"> <script language="JavaScript" type="text/javascript" src='hvmenu/exmplmenu_var.js'></script>
    <script type='text/javascript' src='hvmenu/menu_com.js'></script>
    <noscript>
    Your browser is not compatible to view the Navigation Menu. We suggest you upgrade your browser or use the text links at the bottom of the page.
    </noscript>
    </div>
    <!--- main DHTML navigation script ends -->

    No matter what I do I cannot remove the DHTML menu from the print page. Later on in the page there is another DIV (<div id="footer3">) that I use #footer3{ display:none;} for and it removes fine.

    Can anyone help me out with this. Thanks.
     
    Funky Monk, Feb 8, 2005 IP
  2. SEbasic

    SEbasic Peon

    Messages:
    6,317
    Likes Received:
    318
    Best Answers:
    0
    Trophy Points:
    0
    #2
    You should use this...

    @media print{
    Place the styles you'd like printed in here...

    Anything you don't want printed, use display:none for...
    }
     
    SEbasic, Feb 8, 2005 IP
  3. Funky Monk

    Funky Monk Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Do you mean put @media print{
    etc....
    }

    in the external stylesheet or inline?

    It's not that my stylesheet doesn't work. It does, but just 1 div is left in.
     
    Funky Monk, Feb 8, 2005 IP
  4. SEbasic

    SEbasic Peon

    Messages:
    6,317
    Likes Received:
    318
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Ah...

    Sorrry - Ignore me if your method works ;)

    Don't know how your method so can't help really...
     
    SEbasic, Feb 8, 2005 IP