Creer un cadre de contact en <div>

Bonsoir tout le monde,

j'aurais aimé avoir votre avis sur la meilleur facon de mettre en forme un formulaire de contact.

Personnellement, je procede d'un facon qui, j'en suis sur, pourrai utilisé moins de <div>.

Code HTML

<form name="form1" method="post" action="formmail.php3">
			<div class="bloc">
				<p class="infos">Nom :</p>
				<p class="result"><input type="text" name="nom" size="20"><span class="etoile">*</span></p>
			</div>
			<div class="bloc">
				<p class="infos">Pr&eacute;nom :</p>
				<p class="result"><input type="text" name="prenom" size="20"><span class="etoile">*</span></p>
			</div>
			<div class="bloc">
				<p class="infos">Entreprise :</p>
				<p class="result"><input type="text" name="entreprise" size="20"><span class="etoile">*</span></p>
			</div>
			<div class="bloc">
				<p class="infos">email :</p>
				<p class="result"><input type="text" name="submit_by" size="20"><span class="etoile">*</span></p>
			</div>
			<div class="bloc">
				<p class="infos">T&eacute;l&eacute;phone :</p>
				<p class="result"><input type="text" name="tel" size="20"><span class="etoile">*</span></p>
			</div>
			<div id="bloc_com">
				<p class="infos">Commentaire :</p>
				<p class="result"><textarea name="commentaire" cols="30"></textarea></p>
			</div>
			<div class="bloc">
				<p id="bouton"><input type="submit" name="Submit" value="Envoyer"> <input type="reset" name="Submit2" value="Effacer"></p>
			</div>
		</form>

Code CSS

.infos{
float: left;
width: 200px;
margin: 3px 0 10px 0;
}
.result{
float: left;
width: 300px;
margin: 3px 0 10px 0;
}
.bloc{
width: 550px;
height: 20px;
margin: 0 0 10px 0;
}
#bloc_adresse{
width: 550px;
height: 80px;
}
#bloc_com{
width: 550px;
height: 60px;
}
.result_ad{
float: left;
width: 300px;
margin: 3px 0 10px 0;
}
#infos_ad{
float: left;
width: 200px;
height: 60px;
margin: 3px 0 10px 0;
}
#contact_choix{
font: bold;
color: #C90039;
float: left;
width: 550px;
}
#bouton{
font: bold;
float: left;
width: 550px;
text-align: center;
}
.etoile{
font: bold;
color: #C90039;
}

Pour chaque ligne j'utilise une div et il me semble avoir vu sur un certains site nommé AlsacreationS : "trop de div tue les div" donc voila le but de mon post.

Merci de m'aider

Ben heu... oui, à priori, tu pourrais virer tous ces divs, mais si tu as balisé de la sorte ton formulaire, c'est pour une raison particulière je présume. Avec un exemple en ligne du résultat escompté, on serait plus à même de se rendre compte du but recherché par un tel balisage.

Bonjour,

Il manque surtout un élément fondamental dans ton formulaire: le label .

Plus d'infos: Comment utiliser l'élément label pour étiquetter les contrôles de formulaire ?

http://www.mila48.com/contact_mila48.php

Voili voilou
Modifié par JBENs (25 Jun 2007 - 20:41)

Encore un truc que je connaissai pas, Merci Igor c'est noté

Perso je ferais comme un truc du genre :

<p><label for="nom">Nom :</label><input name="nom" id="nom" size="20" type="text"><span>*</span></p>

Avec la css suivante :

form label {float: left; width: 10em;}
form p span {color: red;]

Il y a beaucoup moins de code.

P.S. : ne pas oublier les id sur les champs pour les labels et l'accessibilité.
Modifié par Patidou (25 Jun 2007 - 21:08)

Effectivement il y a bcp moins de code ^^

Merci pour ces infos, je m'y met tout de suite