The link: http://www.jamiegerrard.com/carpentersUnion/

As you can see there is a block of whitespace when viewing in IE. Now when it's viewed in Firefox it renders fine.

I thought it may have to do with IE rendering of a margin but I think I've tried everything, any ideas?

CSS

Code:
html, body {margin:6px 0 0 0; padding:0;}
img {border:0; margin:0; padding:0;}

#container {width:701px; margin:0 auto; padding:0px; background:url(../images/common/bgContainer.gif) repeat-y;}

#containerTop {width:701px; height:6px; background:url(../images/common/bgTop.gif) no-repeat top; clear:both;}
#containerBottom {width:701px; height:6px; background:url(../images/common/bgBottom.gif) no-repeat bottom;}

#content {width:556px;}
#header {width:556px; height:84px; float:left;}
#nav {width:141px; float:right;}
HTML > DIV's

Code:
<div id="container">
	<div id="containerTop"></div>
	<div id="nav"><img src="_assets/images/common/testInfoLink.gif" /></div>
	<div id="header"><img src="_assets/images/common/testLogo.gif" /></div>
	<div id="content"></div>
	<div id="containerBottom"></div>
</div>