OMG tables and WordPress

Dear forummembers,

I have a big problem with a website i’m building for a client. The client has made an app to intergrate Google Maps and Google Earth into your TomTom. With this app he offers finished routefiles for your TomTom. Because he has so many routefiles he insisted to put every routefile in a table. You can find an example here.

As you can see there are many different countries. The problem exists when you choose a country. Let’s look at Germany. You can see the table aligns good and everything seems to be nice, but if you scroll down, you’ll see some links that will ‘fall’ out of the td!?!?!

Does anyone know how to fix this. I’ve entered the tables through html-editor in the WordPress CMS and styled them with CSS like this:

<table class="tableRouteFiles">
<tbody>
	<tr>
		<td class="tdHeadRouteFiles">
			<a href="../maps/Tyre_D.html" target="_blank">
				Would you like to see the available itineraries in real? Click here!
			</a>
		</td>
	</tr>
	<tr>
		<td class="tdHeadCountry">
        	Files
        </td>
		<td class="tdHeadRoutes">
        	Region / Description
        </td>
	</tr>
	<tr class="trRouteFile">
		<td class="tdRouteFile">
        	<a href="files/D-Allgautour%201.itn">D-Allgautour 1</a><br clear="all"/>
            <a href="files/D-Allgautour%202.itn">D-Allgautour 2</a>
		</td>
		<td class="tdRouteDesc">
		     Region: Bayern.<br clear="all"/><br clear="all"/>No description.
		</td>
	</tr>
</tbody>
</table>

This is the CSS belonging to the table:

table,
.tableCountries,
.tableRoutefiles
{
	float: left;
	margin: 0;
	padding: 0;
	position: relative;
	width: 510px;
}
.tableCountries,
.tableRouteFiles
{
	border: 1px solid #333;
	margin: 0 0 10px 0;
}
	.trRouteFile
	{
		border-bottom: 2px solid #333;
		float: left;
		position: relative;
		width: 504px;
	}
		.tdRouteFile,
		.tdRouteDesc
		{
			float: left;
			position: relative;
		}
			.tdRouteFile
			{
				width: 220px;
			}
			.tdRouteDesc
			{
				border-left: 1px solid #333;
				padding: 0 5px 0 5px;
				width: 269px;
			}
			.tdRouteDesc p
			{
				width: 200px;
			}
			.tdRouteDesc p a
			{
				width: 50px;
			}

	.tdHeadCountry,
	.tdHeadRoutes,
	.tdHeadRoutefiles
	{
		background: #AEA294;
		color: #333;
		float: left;
		font-size: 1em;
		font-weight: bold;
		height: 20px;
		position: relative;
		text-align: center;
	}
	.tdHeadCountry
	{
		border-bottom: 1px solid #333;
		border-right: 1px solid #333;
		width: 220px;
	}
	.tdHeadRoutes
	{
		border-bottom: 1px solid #333;
		width: 279px;
	}
	.tdHeadRouteFiles
	{
		background: #3f3a34;
		border-bottom: 1px solid #333;
		height: 50px;
		padding: 0;
		width: 504px;
	}
		.tdHeadRouteFiles a
		{
			display: block;
			text-align: center;
			width: 100%;
		}
		.tdContentCountry,
		.tdContentLink
		{
			float: left;
			position: relative;
		}
		.tdContentCountry
		{
			border-bottom: 1px solid #333;
			border-right: 1px solid #333;
			font-weight: bold;
			text-indent: 20px;
			width: 220px;
		}
		.tdContentLink
		{
			border-bottom: 1px solid #333;
			text-align: center;
			width: 279px;
		}