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.

Firefox screws up print version

Discussion in 'CSS' started by ndogg, Feb 11, 2006.

  1. #1
    My site is finally finished.

    Check out a page here: http://www.hawkherald.com/about.php

    But there is still one minor problem. If you try to print an article (or any page) that is longer than the right navigation, Firefox just completely screws it up. For example look at the print preview in Firefox for this page http://www.hawkherald.com/article/200602001.php--notice how everything is just screwed up?

    This glitch is only present in Firefox (I am using the current version, 1.5.0.1), I have tested it to work fine in both Safari and Internet Explorer. Does anyone know what's going on?

    On a note of lesser importance, the Mac version of Internet Explorer continues to have serious problems with my site. If the left content area (like in the above link) is longer than the content in the right column, it displays the right column at the bottom of the left content area. And also, the background image for my right column continues to show through the footer on IE Mac.
     
    ndogg, Feb 11, 2006 IP
  2. Mystique

    Mystique Well-Known Member

    Messages:
    2,579
    Likes Received:
    94
    Best Answers:
    2
    Trophy Points:
    195
    #2
    Could it be because firefox is not the "superior" browser it claims to be.

    I have read hundreds of weird issues through the use of this browser and hundreds of devoted fans saying "it's just a rare issue"... but the sum of "rare" issues bring in conclusion is not perfect as any of the others.

    Sadly we have to design our sites in accordance with browser compliance for those who use mozilla based browser or any other.

    So tired of firefox to analyze your problem but most of my own using it found an answer through this site:

    http://www.alistapart.com

    give it a try, because it should be matter of the stylesheet.
     
    Mystique, Feb 11, 2006 IP
  3. FeelLikeANut

    FeelLikeANut Peon

    Messages:
    330
    Likes Received:
    19
    Best Answers:
    0
    Trophy Points:
    0
    #3
    For #leftcontainer you have overflow:hidden—delete that. I don't see what purpose this property serves your page, so nothing else should be affected.
     
    FeelLikeANut, Feb 11, 2006 IP
  4. stuw

    stuw Peon

    Messages:
    702
    Likes Received:
    44
    Best Answers:
    0
    Trophy Points:
    0
    #4
    would you even want to have the right column printed out?
    use display:none to hide it from the printer....
     
    stuw, Feb 11, 2006 IP
  5. AWD1

    AWD1 Peon

    Messages:
    191
    Likes Received:
    12
    Best Answers:
    0
    Trophy Points:
    0
    #5
    First of all, I wouldn't worry about IE for the MAC if I were you. Microsoft doesn't even allow you to download it from their MACtopia site as of January 31, 2006. And on the same site, they flat-out tell the user to upgrade to another browser (e.g. Apple Safari).

    For more information, click here:

    http://www.microsoft.com/mac/products/internetexplorer/internetexplorer.aspx?pid=internetexplorer

    As far as the layout of the page goes, I'd agree with stuw: the right side serves no useful purpose when printed. Neither, for that matter, do the search and top menu sections. Use display: none; to hide all of that stuff in print.

    But, having just looked at your source, it doesn't appear that you know how to do that. So, for the benefit of those with flash photography, I'll give you the concept:
    
    <link rel="stylesheet" href="http://www.hawkherald.com/hh.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="http://www.hawkherald.com/printstylesheet.css" type="text/css" media="print" />
    
    Code (markup):
    As you can see, there are two different stylesheets. One will only be visible on screen, and one will only be called when it's time to print. You can eliminate a lot of stuff that doesn't need to print this way (and apply the ideas listed above.
     
    AWD1, Feb 12, 2006 IP
  6. ndogg

    ndogg Peon

    Messages:
    25
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #6
    THANK YOU! YOU FIXED IT!!!

    Seriously though, I posted this problem on four other forums and this was the only solution to the problem.

    I did receive a lot of advice from people saying to turn off the right column with a print css. I did do this, but this never fixed the problem of Firefox only displaying the header on the first page. I am still going to keep my print CSS, because I agree, the site printed looks much better without the right column.

    I was wondering if anyone would want to take the time to look over the rest of my CSS for buggy/unnecessary code at http://www.hawkherald.com/hh.css

    This is my first site I've ever made from the ground up using just CSS. I really like the way things have turned out so far, but I'm sure I still have a few mistakes.
     
    ndogg, Feb 12, 2006 IP
  7. AWD1

    AWD1 Peon

    Messages:
    191
    Likes Received:
    12
    Best Answers:
    0
    Trophy Points:
    0
    #7
    AWD1, Feb 12, 2006 IP
  8. FeelLikeANut

    FeelLikeANut Peon

    Messages:
    330
    Likes Received:
    19
    Best Answers:
    0
    Trophy Points:
    0
    #8
    When I was looking through I also noticed some padding:0 on DIVs that already have no padding, text-align:left on elements that are already left aligned, and several other overflow:hidden. My suggestion, especially if you're still learning, is to treat that style sheet as a first draft. Now that you have figured out how to achieve certain effects, go back and write the style sheet again from scratch. While the first time around would have been trial and error, the second around will, hopefully, just be trial.
     
    FeelLikeANut, Feb 12, 2006 IP