HELP my header is repeating, is repeating, is repeating

[newmeat]

OK so I got some help on how to add links over the top of my store image in the header. When looking in Firefox everything is fine; 1 logo, 3 links over the top. When looking in IE it shows; 1 logo in the background and then repeats the logo over the top and to the right for the 3 links.

 

<tr class="header">
<td valign="middle"><a href="http://tartanmarine.co.uk/store/index.php"><img src="images/oscommerce.gif" border="0" alt="osCommerce" title=" osCommerce "></a></td>
	<td valign="bottom" align="middle" font color="#ffffff"><a class="cat1" href="http://tartanmarine.co.uk/store/news.php">News</a>  | <a class="cat1" href="http://tartanmarine.co.uk/store/customerservice.php">Customer Service</a>  | <a class="cat1" href="http://tartanmarine.co.uk/store/contact_us.php">Contact</a></td>
  </tr>

 

Is the code and the stylesheet has

 

TR.header {
 background: #ffffff;
 background-image: url("images/header_background.gif");
 height: 128px;
 align: center;
}

 

So is there a way of using 2 classes in the same row so that I came call one TR.header1 and delete the background image??

 

Any help appreciated

[newmeat]

Why does Firefox see it as one row with 2 lots of data and one class and IE see it as 1 row with two lots of data and 2 identical header class so the image is repeated????

[spooks]

Why does Firefox see it as one row with 2 lots of data and one class and IE see it as 1 row with two lots of data and 2 identical header class so the image is repeated????

 

 

The default property for background is repeat on, to disable add:

 

background-repeat: no-repeat

 

Sam

[newmeat]

The default property for background is repeat on, to disable add:

 

background-repeat: no-repeat

 

Sam

 

Thanks for that Sam, I know have:

 

TR.header {
 font-family: Arial, Helvetica, sans-serif;
 background: #ffffff;
 background-image: url("images/header_background.gif");
 background-repeat: no repeat;
 height: 128px;
 align: center;
}

 

In my style sheet but still have to logo's :huh: and other ideas???

[newmeat]

I just thought that it didn't work because I had 'no repeat' and it should have been 'no-repeat' but the double image is still there

[spooks]

I just thought that it didn't work because I had 'no repeat' and it should have been 'no-repeat' but the double image is still there

 

OK, unfortunatly different browsers follow different rules. Insead of backround in table try in div, enclosing your header in a div, like this:

 

<div style="background-image:url(image/header_logo.jpg); padding-bottom:10px; margin-bottom:10px; padding-top:0px; background-position: center left ; background-repeat: no-repeat; layer-background-image:url(image/header_logo.jpg); ">

 

at the very top

dont forget the </div> at the bottom of header.

 

Sam

[newmeat]

I just tabbed out the first line and that seems to have worked in IE will have to check Firefox at home.

 

Thanks for the help