IE8, Safari display different td height then IE7

[airmvp23]

I built a site about 3 years ago using spacer.gif to separate td, tr, etc. I think that is what is causing the issue I have now, but not sure.

Basically in IE8 and Safari my webpages show extra height in certain area which ends up spreading the whole page out. I am trying to add CSS in order fix this issue without having to rebuild everything, but I've tried a few things without success.

Can someone look over the html code below and help me with the CSS that I need to add in order to pull the height down? Keep in mind that I tried td, tr height=1px and line-height=1px with no success.

Thanks.


<tr>
<td bgcolor="#3366CC"><img src="../images/spacer1.gif" width="1" height="1"></td>
<td bgcolor="#3366CC"><img src="../images/spacer1.gif" width="748" height="2"></td>
<td bgcolor="#3366CC"><img src="../images/spacer1.gif" width="1" height="1"></td>
</tr>
<tr>
<td bgcolor="#3366CC"><img src="../images/spacer1.gif" width="1" height="1"></td>
<td bgcolor="#0099FF"><img src="../images/spacer1.gif" width="748" height="1"></td>
<td bgcolor="#3366CC"><img src="../images/spacer1.gif" width="1" height="1"></td>
</tr>