white space under header in IE (already did clearBoth fix)

here's the site -- it's an initial install of 1.3.5 with a few mods.

in IE6, there's a 2 or 3px white line separating the bottom edge of the header image (logo.gif) and the top edge of the grey bar below it (div = navcattabs, but including breadcrumb and search_header instead of the category tabs).

there's no such line in firefox. i haven't had the chance to check in safari.

i've seen the earlier threads on this issue. the accepted solution is to delete the clearBoth break after the eof branding display. i've done that, and the space got smaller, but it's still there.

i can get rid of it by setting the margin-top of navcattabs wrapper to -2px in stylesheet.css, but that has the same effect in firefox. so the space disappears in IE at the cost of having the logo.gif image overlaps the top of the navcattabs bar by those same 2 pixels in firefox.

i've searched through the forums for another solution, but if there is one, i haven't been able to make it work.

can anyone help?

I am having the same issue! Does it look like my screen shot? I do not see it on your site.

Try locating your navigation code and what you have defined as .masthead in the tpl_header.php file and use the Zen def's so that this responds to tweaks that work for Zencart.

As you have altered this with your 2 or more def's for these items and I can not determine what might correct it.

awoman,

without your site url...I would guess that yours is an ezpage placeholder issue.

Try locating your navigation code

you mean the code for navcattabs? it's very brief, and in my tpl_header.php:

<!--bof-optional categories tabs navigation display-->
<?php //require($template->get_template_dir('tpl_modules_categories_tabs.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_categories_tabs.php'); ?>
<div id="navCatTabsWrapper">
	<div id="navCatTabs">
	<!-- bof breadcrumb -->
<div id="navBreadCrumb"><?php echo $breadcrumb->trail(BREAD_CRUMBS_SEPARATOR); ?></div>
<!-- eof breadcrumb -->
<div align="right"><?php require(DIR_WS_MODULES . 'sideboxes/search_header.php'); ?></div>
</div>
</div>
<!--eof-optional categories tabs navigation display-->

and what you have defined as .masthead in the tpl_header.php file

i don't know what you mean by masthead. do you mean the logo wrapper? hte word "masthead" isn't in my tpl_header file and didn't show up in a site-wide developer's toolkit search.

and use the Zen def's so that this responds to tweaks that work for Zencart.

as far as i remember, i haven't altered the definitions of any of the div's. i've edited tpl_header only by cutting and pasting and commenting out items i don't want. i also changed some of the align= , i think.

am i understanding you correctly?

just to compare, i went back and uploaded the template_default/common tpl_header.php file with the only change being removing the clearBoth break at the end of the branding display.

same problem.

Hi Kobra,
I have ez pages turned off.

pm

Your page source is far different than a typical cart...i.e. images like your head image are normally in a includes/template/Your_template/images and yours is in http://www.plastiquemonkey.com/wp-content/themes/benevolence/images/subarashii700.jpg

Actually looking closer at the site you provided this is not a ZenCart page...???

ohmygod, i must be tired. i completely screwed up the link!

i linked to the blog (a wordpress site), instead of the shop. the zen cart shop link is this one.

thanks for your patience. i think i'd better get some sleep...

found a trick on http://www.noscope.com/journal/2005/01/showing-css-to-ie-only-the-underscore-hack

in stylesheet.css you can apply different styles swith IE or FF. My problem was with the space between logo and navMainWrapper. In FF was fine but in IE it breaks the design of the site. I add the style #navMainWrapper:

#navMainWrapper, #navSuppWrapper, #navCatTabsWrapper {
margin: 0em 0em;
background-color: #ffffff;
background-image: url(../images/navMain.gif);
background-repeat: repeat-x;
font-weight: bold;
color: #ffffff;
height: 1%;
width: 966px;
}

#navMainWrapper{
margin-top: 0px; /default/
_margin-top: -2px; /only for IE/
}

hope that helps.

I have a display problem, not whitespace, but this is the closest I have found on the forum to my issue. Logo/masthead is not fitting/overlapping in IE even though it displays fine in FireFox: https://www.narnia-productions.com. I've changed the settings re: header and logo information, which is why it is fine in FireFox, but don't know what the problem is when displaying in IE. Any clues?

maybe your problem is related the css support of IE. I had the same problem and I think you could try using different styles for IE and firefox:

.whateverstyle {
margin: 2px; /all browsers/
*margin: 0px; /IE 6 and 7 only/
}

there is a trick called underline (_margin) that works for IE 6 but not for IE 7.
https://www.demo1.adn.es. Stylesheet is: http://www.demo1.adn.es/includes/templates/chs/css/stylesheet.css

There is only one problem about using this trick and its that the css wont validate. Hope that helps you.

solucionoproblemas:

maybe your problem is related the css support of IE. I had the same problem and I think you could try using different styles for IE and firefox:

.whateverstyle {
margin: 2px; /all browsers/
*margin: 0px; /IE 6 and 7 only/
}

there is a trick called underline (_margin) that works for IE 6 but not for IE 7.
www.demo1.adn.es. Stylesheet is: http://www.demo1.adn.es/includes/templates/chs/css/stylesheet.css

There is only one problem about using this trick and its that the css wont validate. Hope that helps you.

Thanks, I'll try this- it would go in the css for my template, I'm guessing. Does it matter where it goes re: the css code?