Header issue (whitespace in IE)...

[Brian Flanagan]

All,

I am having issues with my site that I am unable to fix. I have found other issues that sound the same, but none of the fixes seem to work. If you look at my site (www.imaginart.com.au) in IE, you will see white space between the header image and the rest of the page - in FF however, this is not there (it was, but it's not anymore...must have fixed it doing something else!).

How can I get rid of this?

Look forward to your solutions and thanks in advance :-)

Brian

[countrycharm]

Try this post it might help you out.
http://www.zen-cart.com/forum/showth...itespace+in+IE

[Brian Flanagan]

Thanks, that worked! I tried all his steps one at a time to see if any worked. The change that worked was entering display: none for logowrapper. Hopefully that doesn't cause any other problems, but it doesn't look like it has.

Displaying fine now in FF (on PC and MAC) and IE (on PC).

Thanks :-)

[countrycharm]

If I come across another thread relating to that problem I will post it here for you.

[countrycharm]

I found this thread you might want to try.
http://www.zen-cart.com/forum/showth...white+space+IE
http://www.zen-cart.com/forum/showth...white+space+IE

I don't see any white space with IE7 on your site.

[countrycharm]

And try this one.
http://www.zen-cart.com/forum/showth...white+space+IE

[Brian Flanagan]

Doh...I'm having issues again.

I did get rid of the white space in IE by entering display: none for #logoWrapper, however this brought back another problem.

If I do that the space is gone, but clicking on the 'header' image doesn't link back to the front page. I have a transparent logo.gif on top of my header image to create a link back to the front page, but when I enter the display: none for #logoWrapper, this stops working.

Is there any solution that will allow me to have both? I've tried all the ideas that have been posted and although I can remove the white space another way (by removing <div id="logo">), both of those solutions remove my ability to link back from the 'header' image (really the logo.gif).

At the moment, I have the display: none turned on as if I can only have one solution it would be to have no white space...but I'd love both options if it can be done!

Brian

[countrycharm]

You may need to try to fix the Validation problems you have and see what you get then.
W3C CSS Validator Results for file://localhost/webdeveloper_www.im...3869192750.css

URI : file://localhost/webdeveloper_www.im...3869192750.css

471 #navMainWrapper Value Error : background-color Parse Error -

This page is not Valid XHTML 1.0 Transitional!

Validation Output: 4 Errors

1. Line 246, Column 6: end tag for "div" omitted, but OMITTAG NO was specified.</body></html> ✉
   You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".
2. Line 20, Column 0: start tag was here.<div id="mainWrapper">
3. Line 246, Column 7: XML Parsing Error: Opening and ending tag mismatch: div line 20 and body.</body></html> ✉
4. Line 246, Column 14: XML Parsing Error: Opening and ending tag mismatch: body line 18 and html.</body></html> ✉
5. Line 246, Column 14: XML Parsing Error: Premature end of data in tag html line 2.</body></html>

I don't know how your stylesheet was set up at first, but try adding this

#logoWrapper {
width:auto;
}

instead of what you have. It may work if not change it back. Always clear your IE and FF catch before viewing you site.