Extra horizontal space- div/table/image within <td>

[marvso]

I seem to have a spacing problem in Internet Explorer. In FireFox, www.mario-vs-sonic.co.cc/index1.php displays fine, but in IE the navigation bar gains A LOT of extra space.

#side {

background: url(http://i41.tinypic.com/1knt4.png);
background-color: cc00000;
overflow: hidden;
padding-top: 1px;
padding-right: 1px;
padding-left: 1px;
}

<td bgcolor="#000099"valign="top"id="side"><center><img style="width: 160px"alt=""src="1nav.jpg"width="160"height="30"/></center>HOME</td>

I've moved around the carriage return of the </td>, I've reset the width for #side multiple times, I've set #side's margin to 0... but nothing seems to work. This isn't just a problem with the image, either: if I try to add a table or div into the td, then the same thing happens.

Does anyone know the problem (other than the fact I'm using tables in 2010)? Thanks for any help.

[Zubair]

Wrong section

***Moved to Programming Help***

[Hello71]

This should fix all your problems: http://validator.w3.org/check?uri=ht...Inline&group=0

[misson]

Also read "Why avoiding tables (for layout) is important" or "Why tables for layout is stupid".