floating images in IE

When I float images, I'm having problems. It looks great in Safari and Mozilla, but the accursed IE renders them as having spaces between them. Argh! What is going on? You can see a test page here http://threespeedpress.com/dev/float/test/
The HTML:

<div class="brandFrame">
	<div class="brandNav" style="padding: 9px;   " >
		<img src="../images/retail/ranking.gif" width="54" height="22">
		<img src="../images/retail/ranking/octothorpe.gif" width="8" height="22">
		<img src="../images/retail/ranking/1.gif">
		<img src="../images/retail/ranking/of.gif" >
		<img src="../images/retail/ranking/2.gif">
		<img src="../images/retail/ranking/2.gif">
		<img src="../images/retail/level.gif" width="30" height="22">
		<img  src="../images/retail/levels/1.gif" width="16" height="22">
		<img  src="../images/retail/levels/2.gif" width="16" height="22">
		<img  src="../images/retail/levels/3.gif" width="16" height="22">
	</div>
</div> 

.brandFrame { background: url(../images/retail/brandFrame.png) top left no-repeat;  width: 252px; height: 180px; }

.brandNav { height: 22px; }
.brandNav img { margin: 0px; padding: 0px; border-width: 0px ;  float: left; }