I'm working on a page design that uses a table to display and title and a couple of hyperlinks. Everything appears fine in my IDE (dreamweaver), but the table appears to inherit a massive top and bottom boarder when I preview in either Safari or FireFox. I've posted the code below, basically the black boarders of the table should wrap flush around the green background). I'd appreciate any tips on why this is happpeneing
Thanks
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="../../Css/genericCss.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="body">
<p><strong>INDEX</strong><br />
Index goes here</p>
<table width="100%" height="45" border="2" cellpadding="0" cellspacing="0" class="body">
<tr>
<td><h2>Title</h2></td>
</tr>
<tr>
<td><table width="100%" border="0" class="body">
<tr>
<td width="50%"><h3>Go to previous topic : </h3></td>
<td width="50%"><h3>Go to next topic : </h3></td>
</tr>
</table></td>
</tr>
</table>
<p>text goes here</p>
</div>
</body>
</html>