[Résolu] Formulaire : Champs en face des Label

Bonjour,

J'aimerai savoir comment je peux faire une mise en page d'un formulaire en XHTML / CSS qui serait l'équivalent d'un formulaire mis en page avec des tableaux, c'est à dire que les labels soient en face des champs et que tous les labels et champs soit bien alignés...

Merci d'avance
Modifié par TylerD (16 Jun 2005 - 15:45)

Salut,
une idée :

		<form action="index.html" method="post">
			<div><label for="nom">Nom&nbsp;:</label> <input type="text" name="nom" id="nom"></div>
			<div><label for="email">Adresse email&nbsp;:</label> <input type="text" name="email" id="email"></div>
			<div><label for="site">Site web&nbsp;:</label> <input type="text" name="site" id="site"></div>
		</form>

			form div label
			{
				position: absolute;
			}
			
			form div input
			{
				margin-left: 150px;
			}

Merci je vais essayer de suite

aïe... avec ceci j'ai des problèmes d'affichage sous IE...

mon formulaire est au milieu de ma page j'ai bien mes champs dans mon fieldset mais les label sont en haut de la page...

Je viens d'essayer une technique qui rend pas trop mal :

.field label{
   display: inline;
  float: left;
  width: 160px;
}

fieldset {
	display : block;
	margin : 0;
	padding : 1em;
}

Qu'en pensez-vous ?

ça devrait suffire avec juste :

label {
float: left;
width: 160px;
}

C'est ce qu j'utilise en tout cas (avec le même code HTML que celui proposé par Olivier, soit typiquement :

<div>
<label for="truc">Titre</label>
<input id="truc" />
</div>

Merci beaucoup