Salle 07 Aile B · Saisie et formulaires
Le texte d’exemple qui sert d’étiquette
L’intitulé caché dans le champ disparaît dès la première lettre.
0 salle visitée sur 37
Version ratée
À vous : Remplissez la date de naissance, puis essayez de retrouver le format demandé.
Voir le code, avant et après
Version ratée
<div class="demo-form">
<input type="text" class="input-ph" placeholder="Date de naissance (JJ/MM/AAAA)" aria-label="Date de naissance" data-r="f2">
</div>
Version corrigée
<div class="field">
<label for="naissance">Date de naissance</label>
<input type="text" id="naissance"
inputmode="numeric" autocomplete="bday"
aria-describedby="naissance-hint">
<p id="naissance-hint">Format : JJ/MM/AAAA</p>
</div>
.field {
display: flex;
flex-direction: column;
gap: 0.25rem;
margin-bottom: 1rem;
}
.field label {
font-weight: 600;
font-size: 0.9rem;
color: #d0d0d0;
}
.field input {
padding: 0.6rem;
border: 1px solid #555;
border-radius: 0.35rem;
background: #111;
color: #fff;
}
.hint {
font-size: 0.85rem;
color: #888;
margin-top: -0.5rem;
}