Annoying.. annoying

Does anyone know how to eliminate spacing between tables? For some reason during the making of my layout there is an annoying horizontal gap between the three main tables of the layout. Its been a while so I’m naturally very rusty to layout coding, especially since I just got off my WoW addiction…

Here’s some information to help out:

The Layout:

The Code:

<html>
<head>
<title>layout2</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#FFFFFF">
<table class="structure" name="Super Table" width="766" border="0" cellpadding="0" cellpadding="0">

<tr><td>
<table class="structure" name="Header Table" width="766" height="124">
	<tr>
		<td>
		<img src="images/index_01.gif" width="766" height="124">
		</td>
	</tr>
</table>
</td></tr><tr><td>
<table class="structure" name="Content/Nav Container Table" width="766">
	<tr>
		<td>
			<table class="structure" name="Content Table - 3 cells, one row. All expand." width="587">
				<tr>
					<td class="expandingtablecell" width="40">
					<img src="images/index_02.gif" width="40" class="expandingimg">
					</td>
					<td class="expandingtablecell" width="507" background="images/index_03.gif">
					<!-- Content -->
					</td>
					<td class="expandingtablecell" width="40">
					<img src="images/index_04.gif" width="40" class="expandingimg">
					</td>
				</tr>
			</table>
		</td>
		<td>
			<table class="structure" name="Nav Table" width="179">
				<tr>
					<td>
					<img src="images/index_05.gif" width="179">
					</td>
				</tr>
			</table>
		</td>
	</tr>
</table>
</td></tr><tr><td>
<table class="structure" name="Bottom Table" width="766" height="67">
	<tr>
		<td>
		<img src="images/index_06.gif" width="766" height="67">
		</td>
	</tr>
</table>

</td></tr>
</table>


</body>
</html>