05-01-2008, 05:44 PM
Sephi-Chan a écrit :Code PHP :<?php
<form action="traitement_inscription.php" method="post">
<div>
<label><span>Nom :</span><input type="text" name="pseudo" maxlength="50" /></label>
<label><span>Email :</span><input type="text" name="email" maxlength="50" /></label>
<p>Votre mot de passe sera généré automatiquement et vous sera envoyé par email.</p>
<input type="submit" value="Créer le compte" />
</div>
</form>
Avec pour CSS :
Code :
form label {
display: block;
margin: 10px 0;
}
form label span {
display: block;
width: 100px;
float: left;
}
form label input {
padding: 1px;
}
form input {
padding: 2px 5px;
border: 1px solid #666;
background: #f2f2f2;
}Je ne suis pas d'accord avec toi sur l'imbrication des balises du formulaire. La sémantique voudrait plutôt que l'on utilise un code de cette forme :
Code PHP :
<?php
<style type="text/css">
.cssForm p{
width: 250px;
clear: left;
margin: 0;
padding: 5px 0 8px 0;
padding-left: 255px; /* Largeur de l'élément contentant le label */
height: 1%;
}
.cssForm p.nolabel{
width: 505px; /* Largeur totale */
padding-left: 0px;
}
.cssForm label{
font-weight: bold;
float: left;
margin-left: -255px; /* Largeur de l'élément contentant le label */
width: 250px; /* Largeur des labels */
}
</style>
<form action="traitement_inscription.php" method="post" class="cssForm">
<div>
<p>
<label for="pseudo">Nom :</label>
<input type="text" id="pseudo" name="pseudo" maxlength="50" />
</p>
<p>
<label for="email">Email :</label>
<input type="text" id="email" name="email" maxlength="50" />
</p>
<p class="nolabel">Votre mot de passe sera généré automatiquement et vous sera envoyé par email.</p>
<p><input type="submit" value="Créer le compte" /></p>
</div>
</form>