I have some problem once again. Why is there so much empty space below the button? It seems there's more than required above the first row of the table as well. What am I doing wrong? The file is XHTML 1.1 valid. I checked with FF only, IE always gives me wrong results so I don't care at this point.

I always seem to spend most of my time dealing with such weird problems!
Here's the thing:

HTML:
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1257" />
<title>Delete News</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>

<div id="record_container" class="med_bg">
	<form method="post" action="../process/news.php?do=delete">
		<table>
			<tr>
				<td><b>Headline</b></td>
				<td><b>Posted</b></td>
				<td><b>&nbsp;</b></td>
			</tr>
			<tr>
				<td><a href="del_news.php?item=10">Headline 1</a></td>
				<td>2005-08-15</td>
				<td><input type="checkbox" name="item_array[]" value="10" /></td>
			</tr>
			<tr>
				<td><a href="del_news.php?item=9">Headline 2</a></td>
				<td>2005-08-14</td>
				<td><input type="checkbox" name="item_array[]" value="9" /></td>
			</tr>
			<tr>
				<td><a href="del_news.php?item=8">Headline 3</a></td>
				<td>2005-08-14</td>
				<td><input type="checkbox" name="item_array[]" value="8" /></td>
			</tr>
			<tr>
				<td><a href="del_news.php?item=7">Headline 4</a></td>
				<td>2005-08-10</td>
				<td><input type="checkbox" name="item_array[]" value="7" /></td>
			</tr>
			<tr>
				<td><a href="del_news.php?item=6">Headline 5</a></td>
				<td>2005-08-09</td>
				<td><input type="checkbox" name="item_array[]" value="6" /></td>
			</tr>
			<tr>
				<td><a href="del_news.php?item=5">Headline 6</a></td>
				<td>2005-08-09</td>
				<td><input type="checkbox" name="item_array[]" value="5" /></td>
			</tr>
			<tr>
				<td colspan="3"><input type="submit" value="Delete Selected" /></td>
			</tr>			
		</table>
	</form>
</div>

</body>
</html>
CSS:
HTML Code:
html
{
  margin: 0;
  width: 100%;
  height: 100%;
}

body
{
  background-color: #E6E6E6;
  font-family: verdana;
  font-size: 0.7em;
  display: table;
  color: #000000;
  margin: 0;
  width: 100%;
  height: 100%;
}

input, textarea
{
  font-family: verdana;
  font-size: 1em;
  background-color: #FCFCFC;
  border: 1px solid #C5C9D1;
  margin: 0.1em;
}

input:hover, textarea:hover
{
  background-color: #FFFFFF;
  border: 1px solid #A4A8B0;
}

input:focus, textarea:focus
{
  background-color: #FFFFFF;
  border: 1px solid #A4A8B0;
}

.med_bg
{
  border: 1px solid #C5C9D1;
  background-color: #D9DDE5;
}

#record_container
{
  display: table;
  margin: 0 auto;
  padding: 0.5em;
  text-align: center;
}

a
{
  color: #000000;
  text-decoration: none;
}

a:hover
{
  color: #FF0000;
}
Any help would be greatly appreciated.

EDIT: Corrected, no need to reply!