28172 sujets

CSS et mise en forme, CSS3

Bonjour j'ai trifouiller un peu ,j'ai réussi a fixer les decalages des inputs radio text checkbox.
Des marges entres navigateurs dus aux retours chariots. Pour le input text plus de decalage
entre IE et FF comme ça nikel.
Pour la checkbox en elle même c'est bon mais pour caller le texte a cote une autre histoire.

<div class="bouton"><input type="checkbox" /></div> /* Aucun retour a la ligne retour chariot créer une marge sur IE */
<div class="bouton"><input type="checkbox" /></div>

*{
margin:0;
padding:0;
}

.bouton{
width:150px;
height:13px;
margin-left:20px;
margin-top:20px;
line-height:0; /* Pareil ici retire la marge sur IE */
}


input{
width:13px;
height:13px;
}

salut,

Pourquoi tu mets ton texte à coté des inputs ?

ex:


texte <input type="checkbox">

ou

<input type="checkbox"> texte



++
Modifié par flattazor (25 Mar 2009 - 20:20)
Salut,

... et c'est encore mieux en utilisant les éléments LABEL :
<label for id="macheckbox">texte</label>
<input type="checkbox" name="macheckbox" id="macheckbox" />
Le premier avantage est qu'ils améliorent l'ergonomie dans les navigateurs graphiques puisqu'un clic sur le texte donne le focus au champ de saisie associé.
Le second est qu'ils améliorent l'accessibilité dans les lecteurs d'écrans puisqu'ils associent un texte avec le champ de saisie correspondant.

Il suffit ensuite de styler LABEL et INPUT pour obtenir la mise en page que l'on souhaite (voir par exemple cette page de tests sur covertprestige.info).