Problema con allienamento di un form e pulsanti vari

[garlick]

Ciao, devo disporre un form in modo che sia inline, utilizzo questo codice:

xhtml:

<div id="top-space">
	
	<div class="login">
        Member <font color="#73C5FB">Login </font>
	
        <form action="" method="post" id="login" name="login">
	<input name="" type="checkbox" value="" />
	<input name="" type="text" class="campo-testo"/>
	<input name="" type="password" class="campo-testo" />
	</form>	
	 
        <a href="#" onclick="javascript:document.login.submit();">
        [img]img/button-go.gif[/img]</a> 
	[img]img/button-signup.gif[/img] 
	[img]img/button-forgot.gif[/img]
	</div>
	
</div>

CSS:

div{
margin:0;
border:0;
padding:0;
}

img{border:0; vertical-align:middle;}

form{display:inline; 
vertical-align:middle;
padding:0;
margin:0;
}

#top-space{
background-image:url(img/top-space.gif);
width:1000px;
height:30px;
}

.login{
font-size:9px;
padding:4px 0px 0px 10px;
}

.campo-testo{ border: #A1AAB1 1px solid; background:transparent; margin:0;}

Questo è il risultato con IE6:



Questo con Firefox:



Come vedete in firefox i bottoni sono spostati più verso il basso, mentre io vorrei che fossero centrati in verticale come in IE.
Non c'è poi modo di centrare anche la checkbox?

Ciao e grazie