Tags:




Logo NoGo in Firefox
January 20, 2006 9:01 AM   RSS feed for this thread Subscribe

Can you see why my website's logo is messed up in Firefox but displays okay in IE

Now How often does that happen instead of the other way around.
My web page is http://www.nh.gov/treasury . It is a straight HTML page but because the logo is changed based on the Department that is being displayed on the page the image is broken into several pieces.

The lower right hand part of the logo displays incorrectly in Firefox. I don't have control of the layout of the logo as we are part of the NH.gov portal but I could alter the styles on the images for the pages on my part of the portal. Yes, the logo displays the same way on the main nh.gov pages.

Any assistance and direction you could provide would be greatly appreciated.
posted by mickbw to computers & internet (6 comments total)
It looks like it's coded to use the broken box model in IE. Here's some more information about it.
posted by bshort at 9:05 AM on January 20, 2006


Removing this from the top:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

Fixes it for me... but I'm not sure why.
posted by ducksauce at 9:22 AM on January 20, 2006


Your page is failing validation with 13 errors for HTML 4.01 Strict. Check it out at the W3C validator. Try fixing it to validate to clear up the difference or change to a HTML 4.01 Transitional DOCTYPE, as described here.

Or you could hack in a browser check that declared the height of top_3.jpg when firefox is detected to a height of 28, leaving it at 34 for IE. That should fix the immediate problem, but such a hack is so horrible and grotesquely amateurish you should immediately forget I ever mentioned the possibility.
posted by mdevore at 10:21 AM on January 20, 2006


I think a very simple solution is to make the entire top bar one image - I don't really see why it needs to be broken up. I've always been of the school of why make it more difficult then it needs to be. Oddly enough removing the doc type works for me as well - but not in Safari...

(very funny mdevore!)
posted by meta x zen at 10:39 AM on January 20, 2006


Your doctype should be all on one line. It should not look like the one in ducksauce's comment above. Make sure line wrapping in your text editor doesn't cause this to happen.

That isn't to say that your problem would be fixed by making that change - just that it's a basic problem that could cause many more, especially when trying to validate the code.
posted by odinsdream at 11:38 AM on January 20, 2006


It works for me without the DOCTYPE too.

I feel I should mention that the background of header_left-treasuryindex.png is a different color than the page background.

What's going on: Your header proper (that Michael A. Ablowich - State Treasurer stuff) is ~4px taller in Firefox than in IE (and than your image).

Why it's going on: ?
posted by fidelity at 1:54 PM on January 20, 2006


« Older [UmbrellaFilter] I'd like to g...   |   Do I need to refrigerate vinai... Newer »
This thread is closed to new comments.