28172 sujets

CSS et mise en forme, CSS3

Salut
je veux mettre en forme deux champs de saisie(login et password) de façon qu'ils soient aligner horizontalement.
la premier photo montre comment il sont aligner actuelement et la deuxieme comment je veux les aligner

image 1
upload/36887-login.png

image2
upload/36887-login2.png



<span  id="logon_input">
<div>  <label>Username:</label> <input type="text"/>  </div>
							
<div>  <label>Password:</label> <input type="password" /> </div>
</span>






 #logon_input{

float:right;
	
}

supprime les divs elles n'apportent rien et en plus gênent l'alignement ( faut les passer en inline-block dans ton cas )
j'ai bien supprimer les div et j'ai ajouter la propriété inline-bloc mais j'ai toujours le même problème,est ce que vous avez une autre idées ?
merci
bonsoir/bonjour,

premiere remarque :
<span  id="logon_input"> 
<div>  <label>Username:</label> <input type="text"/>  </div> 
                             
<div>  <label>Password:</label> <input type="password" /> </div> 
</span> 

un <span> ne doit pas contenir des element de type block tel qu'un <div>.
la structure aurait put-être :
<div  id="logon_input"> 
<p>  <label>Username:</label> <input type="text"/>  </p>                          
<p>  <label>Password:</label> <input type="password" /> </p> 
</div> 


Ton defaut provient de ton float qui reduit/compresse la largeur d'affichage de #logon_input.

la demarche simple serait:
<p  id="logon_input"> 
<label>Username:</label> <input type="text"/>
<label>Password:</label> <input type="password" />
</p> 

et
#logon_input {text-align:right;}


Cordialement
Modifié par gc-nomade (16 May 2011 - 00:49)
ça n'a pas résolut le problème, les LABEL sont aligner à droite mais les INPUT sont à gauche.