Alignent texte et inputs dans un tableau sans tableau

Amis des CSS Bon-jour !!

voilà j'ai un formulaire composé de 4 div positionnées (en POURCENTAGES) en float:gauche dans container (600 PIXELS) de façon à ce qu'elles soient 'en ligne'.

les colonnes 1 et 3 contiennent du texte (nom <br /> prénom <br /> date de naiss < br /> etc...) dimensionné en EM,
les colonnes 2 et 4 contiennent des inputs (EM) ou des selected (EM), champs à remplir correspondants aux éléments textes des div 1 et 3.

Malheureusement, le texte ne se retrouve jamais pile poil en face du champs à remplir...

Ma question est donc: comment faire en sorte que le texte soit en face du champs correspondant et ce, quelque soit le navigateur ?

est il vraiment judicieux dans ce cas de figure de bannir les tableaux à 100%, car une mise en forme approximative ne ferait que fausser le contenu et la compréhension globale de mon formulaire.

d'avance merci

Salut,

alors, c'est un vrai foutoir ton topic
On y comprend rien, du titre au contenu en passant par les explications etc...

C'est difficile de suivre ce que tu veux.
(relis ton titre, si tu y comprend quelque chose, c'est que tu t'es trop habituée à ton langage).)

Pour le :

a écrit :

une mise en forme approximative ne ferait que fausser le contenu et la compréhension globale de mon formulaire.

Si ton code HTML est bien conçu, non pas du tout, ce n'est pas un décalage de quelques pixels qui changera grand chose.

Ton code HTML et CSS serait appréciable, je redoute un mauvais code HTML de ce que je lis de ton message.
Un exemple en ligne à l'appui serait appréciable aussi.

Sinon, pour tableau/pas tableau pour les formulaires, nous en avons déjà parlé sur ce forum.
Et les CSS n'ont jamais impliqué le bannissement total des tableaux, ils faut juste les utiliser à bon escient (et donc pas pour la mise en page).

Bonjour hellnn, et bienvenue sur ce forum,

Maintenant... Argh !

Ce cri du coeur est motivé par l'inaccessibilité complète de ton formulaire :
- tu n'utilises apparemment pas le très utile élément <label> (voir la FAQ du forum)
- ton formulaire sera indéchiffrable une fois "linéarisé", c'est à dire dans n'importe quel navigateur ou autre client (lecteur d'écran) qui ne disposera pas de CSS. En effet, il donnera quelque chose comme :

a écrit :
nom :
prénom :
date de naissance :
[ ici le champ nom ]
[ ici le champ prénom ]
[ ici le champ date de naissance ]

Comment savoir alors qui correspond à quoi ?

Donc :
- utiliser <label for=""> comme indiqué dans la faQ
- ne pas hésiter à utiliser un tableau simple, si le positionnement CSS conditionne l'accès au formulaire. Attention cependant à ce que le formulaire reste accessible une fois le tableau linéarisé...

re

Désolée si ma question n'est pas claire Olivier et merci à Laurent pour ta réponse.Ca ne fais qu'un mois que je fais du html donc merci d'être indulgent,
on à tous été débutant un jour

Le fait que tout soit en linéaire est effectivement ce que je redoutais, d'où ma question (aussi mal formulée soit-elle)..

je vais donc garder le tableau pour aligner le texte et les champs et jeter un oeil au <label for="">, merci.

hellnn a écrit :
re

Désolée si ma question n'est pas claire Olivier et merci à Laurent pour ta réponse.Ca ne fais qu'un mois que je fais du html donc merci d'être indulgent,
on à tous été débutant un jour

Le fait que tout soit en linéaire est effectivement ce que je redoutais, d'où ma question (aussi mal formulée soit-elle)..

je vais donc garder le tableau pour aligner le texte et les champs et jeter un oeil au <label for="">, merci.

Il n'y a pas de mal à débuter on ne te le reproche pas

Ce que souligne Laurent est ce que je redoutais

Pour la mise en forme, il se peut que tu n'ais pas besoin des tableaux, c'est même à peu près certain, mais il faudrait savoir ce que tu veux obtenir comme mise en forme.
Modifié par Olivier (30 Jul 2005 - 17:45)

hellnn a écrit :
Ca ne fais qu'un mois que je fais du html donc merci d'être indulgent,
on à tous été débutant un jour

Rassures-toi : ne faire du html que depuis un mois et se préoccuper de ce genre de chose, ça mérite une pleine et entière indulgence

Si tu veux rester sur une solution CSS accessible, cet article sur les listes de définition te donnera de bonnes pistes pour les formulaires : http://pompage.net/pompe/listesdefinitions/ L'utilisation judicieuse de la propriété float:left des éléments <dt> permet d'aligner légende et champs correctement.

Pour une solution tableau, il faut veiller :
- à ce que la cellule contenant le <label> précède immédiatement celle contenant le champ (attention donc aux labels placés "au-dessus" du champ)
- ou à placer <label> et champ dans la même cellule
Modifié par Laurent Denis (30 Jul 2005 - 18:07)

merci

un peu de lecture s'impose...

j'ai acheté le livre de R.Goetter hier, donc ça devrait m'éclaircir les idées.

je pense que je comprendrai mieux vos explications après et que vous comprendrez mieux mes questions aussi ! Bref que nous parlerons un langage commun.

a bientot alors