[Résolu] Aidez moi à ne pas utiliser de tableau ^^

Bonjour,

Je ne sais pas comment faire ça en css :

<table border="0">
	<tr>
		<td><label><input type="checkbox" /> Choix 1</label></td>
		<td><input id="msn2" name="msn2" type="input" /></td>
	</tr>
	<tr>
		<td><label><input type="checkbox" /> Choix 222</label></td>
		<td><input id="msn2" name="msn2" type="input" /></td>
	</tr>
</table>

Le but étant d'aligner les éléments pour faire quel chose propre.

Merci d'avance
Modifié par Spark (23 Sep 2007 - 18:39)

Hello,

Pour commencer, à quoi servent les input de type checkbox?

Pour la suite... voir cette page, qui ne traite pas d'éléments de formulaire mais qui se rapproche un peu de ce que tu veux faire:
http://web.covertprestige.info/test/26-liste-definitions-mise-en-page-tableau.html
(On notera aussi, au passage, qu'on a ici la possibilité d'utiliser le balisage que l'on veut, ce qui permettra de palier aux limites soulevées dans la page ci-dessus.)

Pour finir: des labels explicites (avec attribut for qui va bien, ça serait sympa pour améliorer l'accessibilité de ton formulaire.

Florent V. a écrit :
Pour commencer, à quoi servent les input de type checkbox?

C'est pour faire la mise en page d'un formulaire, ici j'ai allégé le code pour l'exemple. Voici un extrait du formulaire :

http://forum.alsacreations.com/topic-5-29011-1-Engriser-ou-non-des-champs-dans-un-formulaire.html

Florent V. a écrit :
Pour la suite... voir cette page, qui ne traite pas d'éléments de formulaire mais qui se rapproche un peu de ce que tu veux faire:
http://web.covertprestige.info/test/26-liste-definitions-mise-en-page-tableau.html
(On notera aussi, au passage, qu'on a ici la possibilité d'utiliser le balisage que l'on veut, ce qui permettra de palier aux limites soulevées dans la page ci-dessus.)

Ok merci je vais regarder ça

Florent V. a écrit :
Pour finir: des labels explicites (avec attribut for qui va bien, ça serait sympa pour améliorer l'accessibilité de ton formulaire.

Je croyaist que c'était utile uniquement quant le label est "éloigné" de la balise (non imbriqué).

Spark a écrit :
Je croyaist que c'était utile uniquement quant le label est "éloigné" de la balise (non imbriqué).

Théoriquement oui. Mais les labels implicites (le texte descriptif et le contrôle de formulaire, par exemple l'input, sont placés à l'intérieur de l'élément label) sont mal supportés par les différents outils, il me semble.

Voir par exemple le point de contrôle 12.4 du RGAA, qui impose la présence sur les label d'un attribut for pointant vers l'élément de formulaire pertinent.

Pour revenir aux CSS, un peu d'aide:
http://web.covertprestige.info/test/27-formulaires-sans-tableaux.html

Florent V. a écrit :

Théoriquement oui. Mais les labels implicites (le texte descriptif et le contrôle de formulaire, par exemple l'input, sont placés à l'intérieur de l'élément label) sont mal supportés par les différents outils, il me semble.

Voir par exemple le point de contrôle 12.4 du RGAA, qui impose la présence sur les label d'un attribut for pointant vers l'élément de formulaire pertinent.

Ca n'explique pas grand chose. Il mettent le label autour de l'intitulé et non de intitulé et du champ.
Je comprend le point de vu sémantique, mais pas utilitaire.

EDIT : en fait j'imagine que c'est utile pour ce repérer avec des dispositif spéciaux pour mal voyant ou mal entendant.

Florent V. a écrit :
Pour revenir aux CSS, un peu d'aide:
http://web.covertprestige.info/test/27-formulaires-sans-tableaux.html

Oh voilà qui est très intéressant ! Merci !
Modifié par Spark (13 Sep 2007 - 19:56)

Spark a écrit :
Ca n'explique pas grand chose. Il mettent le label autour de l'intitulé et non de intitulé et du champ.

C'est surtout l'attribut for qui est important ici.

Spark a écrit :
EDIT : en fait j'imagine que c'est utile pour ce repérer avec des dispositif spéciaux pour mal voyant ou mal entendant.

Oui. De plus, cela rend le label réactif: si tu cliques dedans, cela donne le focus à l'élément de formulaire concerné.

Florent V. a écrit :
cela rend le label réactif: si tu cliques dedans, cela donne le focus à l'élément de formulaire concerné.

Même sans ça, ça le fait si le champs est dans le label.

J'ai finalement utilisé les position absolu avec des margin là ou il faut, ça fonctionne très bien.

Merci.