Results 1 to 3 of 3

Thread: print.css help

  1. #1
    Join Date
    Jan 2011
    Location
    Southeastern CT
    Posts
    594
    Thanks
    43
    Thanked 28 Times in 28 Posts

    Default print.css help

    Hi folks I am trying to figure out how to set up a print.css page.

    I have this and it is not doing what I want.

    Code:
    #print-button {
    	display: none;
    }
    html{width:50%;border:1px solid black;}
    I want to get rid of all images and print the page text only inside a bordered area.with a width of half the page and a black border around it.

    How would this be done if the page is say 1400px wide,has a table about that width and has colors to the table.
    Thanks,

    Bud

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,951
    Thanks
    43
    Thanked 3,194 Times in 3,157 Posts
    Blog Entries
    12

    Default

    Your post doesn't indicate whether or not you're aware that simply having a print.css file does nothing. It has to be linked to the page and have it's media attribute set to print (in the head of the page, ideally after the other stylesheet(s) for the page, inline styles on the page or added by javascript can be problematic, but usually can be worked around):

    Code:
    <link rel="stylesheet" href="print.css" type="text/css" media="print">
    Once you have that, it's just a matter of getting the css you put in it to do what you're after. Also be aware that css in a media="print" stylesheet can only override and supplement the css for the page. It doesn't replace it, unless the style for the page has its media attribute set to "screen".

    The width of the table will not be changed by a rule for the html element unless the table's width is set as a percent and there are no other intervening elements (parent elements of the table) with a fixed width set.

    I'd really have to see the page to get a better idea. Setting the width and border of the html element is probably not the best approach anyway though. The body might be a better choice. Going after the table itself might be required.

    To get rid of images you would need at least:

    Code:
    img {display: none;}
    in the print stylesheet, maybe more depending on what other styles there are on a page.

    As for colors, well that's ultimately controlled by the user's browser's settings, but most will by default print colors unless they're overridden or for "screen" only. User's browsers often have background colors turned off for printing though. That's something you just have to accept and plan for as a possibility.

    But, as I say, I would need to see the page to be specific. And I should add that it's possible that not all browsers will interpret your styles and stylesheets the same, so testing is required.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Jan 2011
    Location
    Southeastern CT
    Posts
    594
    Thanks
    43
    Thanked 28 Times in 28 Posts

    Default

    Thanks John,I am just begining to experiment with a very generic start.

    I am going to experiment this week end with this to see what I get and yes,I do have the

    Code:
    <link rel="stylesheet" href="print.css" type="text/css" media="print">
    in the head as a start
    Thanks,

    Bud

Similar Threads

  1. Print CSS
    By jr212 in forum CSS
    Replies: 2
    Last Post: 01-27-2012, 09:04 AM
  2. Print CSS
    By vijan87 in forum CSS
    Replies: 0
    Last Post: 10-26-2009, 05:48 AM
  3. Using Cross-browser print button to print a different page
    By egghead2000 in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 04-11-2008, 04:40 AM
  4. Cant get this to print anything out
    By Humper in forum JavaScript
    Replies: 1
    Last Post: 12-19-2006, 01:47 PM
  5. Print Help
    By johnnyi in forum HTML
    Replies: 3
    Last Post: 10-17-2005, 08:15 PM

Bookmarks

Posting Permissions

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