I need a little help from some experienced user to fix a strange behaviour in a theme.The problem is related to the theme's header.
The starnge is that the header is shown correctly in Firebird but not in IE6 as you can see below:

IE6:








and in Firebird(correctly):















Notice that in IE6 only there is a ugly space between the logo and the silver bar just below.

This is the code:

___________________________________

<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" id="okvir">
<tr>
<td>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="headerlogo"><a href="<{$xoops_url}>/"><img src="<{$xoops_imageurl}>images/logo.gif" border="0" alt="Homepage" /></a>
</td>
</tr>
</table>

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr class="navbar">
<td><img src="<{$xoops_imageurl}>images/nav_tab1_bg.gif" width="260" height="16" alt="" /></td>
<td id="headmenu"><a class="menuHead" href="<{$xoops_url}>/index.php">Home</a></td>
<td id="headmenu"><a class="menuHead" href="<{$xoops_url}>/modules/news/">News</a></td>
<td id="headmenu"><a class="menuHead" href="<{$xoops_url}>/modules/myguestbook/">Guestbook</a></td>
<td id="headmenu"><a class="menuHead" href="<{$xoops_url}>/modules/mydownloads/">Downloads</a></td>
<td id="headmenu"><a class="menuHead" href="<{$xoops_url}>/modules/contact/">Contatti</a></td>

</tr>
</table>

________________________________


and these the related .css selectors:

_________________________________

table#okvir
{
background-color: #FFFFFF;
border-right: 1px solid #026CA9;
border-left: 1px solid #026CA9;

td#headerlogo
{
background-color: #ECE9D8;
background-image: url(images/header_bg.gif);
background-repeat:repeat-x;

.navbar
{
background-color: transparent;
background-image: url(images/nav_bar_bg.gif);
}

td#headmenu a
{
background-color: transparent;
color: #6F6635;
padding-left: 4px;
padding-right: 4px;
padding-bottom: 0px;
padding-top: 0px;
border-left: 0px solid #514928;
border-top: 0px solid #514928;
border-bottom: 0px solid #514928;
}
td#headmenu a:hover
{
background-color: #F8F7EF;
color: #B5A966;
}
.menuHead
{
font-size: 10px;
}


__________________________________________________

I hope someone could help me.
Thanks in advance,ralf.

Fix the style.css, unclosed tag in "td#headerlogo" and "table#okvir" selector, "}" .

This might be related to the way the browsers display nested tables, or tables placed on top of the other.

Why are you nesting 2 tables inside a one-celled table? From the code you posted, it seems that the outside table is only used to display borders.

You can convert those 3 tables into 1 table with the first row having colspan of 6. Or you can give each nested table a cell of its own.

Quote:

Thank you SevenD for your quick answer but the tags were already closed;i made a copy/paste error writing the post;
so the problem still remains.

Try to rename(in style.css) td#headerlogo selector to .headerlogo and replace :

Quote:

with:

Quote:

Send me style.css and theme.html if the problem still remains.

ralf57:

If SevenD's solution hasn't worked, try this: make sure that all the tags that form the table including the header logo are in a single line, that is, take out the carriage returns.

Cheers.

Thank you both,but no result even wiht hsalazar suggest:

@hsalazar:now i have this code(wihtout carriage returns):

___________________________
<table class="headerlogo" width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td ><a href="<{$xoops_url}>/"><img src="<{$xoops_imageurl}>images/logo.gif" border="0" alt="Homepage" /></a></td</tr>
</table>
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr class="navbar" >
<td><img src="<{$xoops_imageurl}>images/nav_tab1_bg.gif" width="260" height="16" alt="" /></td>
<td id="headmenu"><a class="menuHead" href="<{$xoops_url}>/index.php">Home</a></td>
<td id="headmenu"><a class="menuHead" href="<{$xoops_url}>/modules/news/">News</a></td>
<td id="headmenu"><a class="menuHead" href="<{$xoops_url}>/modules/myguestbook/">Guestbook</a></td>
<td id="headmenu"><a class="menuHead" href="<{$xoops_url}>/modules/mydownloads/">Downloads</a></td>
<td id="headmenu"><a class="menuHead" href="<{$xoops_url}>/modules/contact/">Contatti</a></td>
</tr>
</table>
_________________________________

@SevenD: i've sent you the files as you requested.

Isn't it related to the height= setting? IE and Mozilla has different ways of interpreting the height setting AFAIK.

I have also had problems with block header graphics being repeated (well, a line or two of graphics) in IE, but not in Mozilla.

Quote:

Thank you Mithrandir,i've set the height value in html code and .css too but this seems not affect the way the header is shown even if i put an high value(ex.400px).
This sound very strange.

Don't know whether this is something what could help.

I didn't follow the thread in detail, but I just remember of a similar problem I had with table etc.

Especially a difference between Mozilla and IE. The default setting for border-collapse is different between Mozilla and IE (As far as I remember).

It's something with border-collapse in the table class definition.

I have something like table {..... border-collapse: separate}
within my stylesheet. Maybe you do a search for border-collapse and how this effect tables.