32 users online (1 members and 31 guests)  


  Results 1 to 5 of 5

Related

  1. Replies: 3
  2. I Don't Want the Page Name to Print!    Forum: HTML Forum
    Replies: 1
  3. Jump Menu covers drop down menu    Forum: HTML Forum
    Replies: 1
  4. Pulldown menu blocks my popup menu    Forum: HTML Forum
    Replies: 9
  5. CSS Print    Forum: CSS Forum
    Replies: 2
  1. #1
    aideenm's Avatar
    New User

    Status
    Offline
    Join Date
    Jul 2004
    Posts
    2

    Red face CSS Print (exclude menu) HELP

    Hi,

    I’m a rookie web designer in trouble…

    I need to remove the menu from the “print preview” and actual prints from my website.

    I have created a print style sheet in Dream weaver; however I still can’t get rid of the menu!

    Can anyone help? I have included below the full CSS I’m currently using.

    Thanx
    Aid

    body {
    margin: 0;
    color: #000000;
    background-color: #fff;
    font-family: 'Verdana, sans-serif';
    font-size: 10pt;
    }

    #banner {
    background-color: white;
    padding: 15px;
    height: 36px;
    text-align: center;
    }

    #banner h1 {
    margin-top: -4px;
    font-size: 12pt;
    font-weight: bold;
    }

    #banner h2 {
    font-size: 9pt;
    font-weight: bold;
    margin-top: -25px;
    }

    navigation {
    display: none;
    }

    .js {
    display: none;
    }


    content {
    padding-top: 15px;
    margin: 5%;
    }

    h3 {
    border: 1px dotted #888;
    margin-top: 7px;
    padding: 2px;
    display: inline;
    background-color: #fff;
    }

    h3 a {
    padding: 3px;
    }

    h2 {
    font-size: 12pt;
    font-weight: bold;
    margin-top: 7px;
    padding: 2px;
    display: inline;
    background-color: #fff;
    }



    p {
    margin: 15px 0px;
    text-indent: 20px;
    line-height: 140%;
    }

    blockquote {
    text-indent: 20px;
    line-height: 140%;
    padding-left: 5px;
    border-left: 1px dotted #888;
    }

    a {
    text-decoration: none;
    }

    a:link {
    color: #036;
    background-color: transparent;
    }

    .postbody a:link:after, .postbody a:visited:after {
    content: " (" attr(href) ") ";
    }

    .posted {
    text-align: right;
    border-top: 1px dotted #888;
    margin-top: 2px;
    font-size: 8pt;
    background-color: #eee;
    }

    .pinged {
    text-align: right;
    border-top: 1px dotted #888;
    margin-top: -20px;
    font-size: 8pt;
    background-color: #eee;
    }

    .extended {
    text-align: center;
    }

    .right {
    float: right;
    padding: 5px;
    margin: 5px;
    border: 1px dotted #aaa;
    }

    .left {
    float: left;
    padding: 5px;
    margin: 5px;
    border: 1px dotted #aaa;
    }

    .center {
    padding: 5px;
    margin: 5px;
    border: 1px dotted #aaa;
    }

    .printonly {
    display: block;
    }

    .screenonly {
    display: none;
    }

  2. #2
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Make a separate stylesheet for printing, link to it like this

    Code:
    <link rel="stylesheet" href="print.css" type="text/css" media="print">
    And in that stylesheet, set anything you don't want to print to

    Code:
    display: none;
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  3. #3
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    In see you have done something similar, so if its not working, possibly elsewhere soemthings wrong. Post a link to your sitye and I can look.
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  4. #4
    aideenm's Avatar
    New User

    Status
    Offline
    Join Date
    Jul 2004
    Posts
    2

    Wink

    Thanks for your help Dean

    Unfortunitly i cant send you the link to the full site.

    However, the site has been made with both a print and page CSS. Can these used together cause conflict?

    My main problem is when i use the print CSS the menu still prints (which i would like to remove) and tables loose their formating. These are not the browser menu's or tables, they are the ones i have created myself for the site.

    Do you know is there code or script i can use to stop this?

    Thanks for your help xx

  5. #5
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Hiya,

    Using media="" should solve it. However, I cannot tell you exactly what is wrong without more information. Can you upload the site somewhere?

    Do you know is there code or script i can use to stop this?
    No 'magic wand' I am afraid, I need to see whats wrong to see how to fix it,.
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?



Tags for this Thread