[Resolvido] input flutuando

Pessoal to fazendo o painel de login, consegui acertar as imagens e tudo mais, só que quando coloco os campos textfield, eles ficam só um em baixo do outro e eu queria os dois lado a lado... Se eu dou float vai os dois pro mesmo lado e não só um... como eu posso fazer para o campo senha ficar ao lado do campo usuario?.. ja tentei float em todos os campos e sempre move os 2 objetos e não só um

	<div id="info">
 <div class="title">
 <h1>LOGIN</h1>
 </div>
 <div class="legends">
 <form action="" method="post" enctype="multipart/form-data" name="legends1">
 <h2>Usuário:</h2>
 <input name="usuario" type="text" id="usuario" />
 <h2>Senha:</h2>
 <input name="senha" type="password" id="senha"/>
 </form>
 </div>
</div><!--info-->

#info{width:420px; float:left;}
#info .title h1{font:22px Verdana, Geneva, sans-serif; color:#FFF; margin-top:25px; margin-left:40px;}
#info .legends{font:8px Verdana, Geneva, sans-serif; color:#FFF; margin-top:70px; margin-left:40px; float:left;}
/#info .legends2{font:8px Verdana, Geneva, sans-serif; color:#FFF; float:right; margin-top:70px; margin-right:30px;}/
#info input{outline:none; padding:4px; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; border:0; margin:2px 0;}