Logo NoGo in Firefox
January 20, 2006 9:01 AM 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.
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.
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
<!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
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
(very funny mdevore!)
posted by meta x zen at 10:39 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
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
This thread is closed to new comments.
posted by bshort at 9:05 AM on January 20, 2006