Version complète: sur le forum Webmaster Hub : formulaire
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
flux37
bonjour,

Je suis en train decréer un tableau avec des formulaires et champs de texte de texte dans les <TD>..

Je voudrais habiller mon formulaire pour qu'l ne déforme plus la cellule et soit de la meme largeur que mon champ de texte..

Voici le css que j'utilise :


CODE
Table input {
width: 100%;
height: 17px;
border:1px solid #ccc;
background-color:#FFF;
font-family: arial, helvetica,sans-serif;
color:#4d4d4d;

}
Table form {
padding:0px 0px 0px 0px;
width:100%;
height: 17px;
}
Quelqu'un pourrait-il m'aider ??
Sammuel
Est ce que tu pourrais poster une partie du code html de ton tableau ?
flux37
voilà la partie html..

<td class="donnees"><form name="form1" method="post" action="">
<input type="text" name="textfield3">
</form></td>

et le style css de données :

td.donnees {
color: #4D4D4D;
background-color: #FFF;
text-align: left;
padding: 0px 40px;
border-bottom:#F7F7F7;
border-left:#fff;
border-right:#F7F7F7;
border-width: 0 1px 1px 1px;
border-style: none solid solid solid;

}

j'espère que ça pourra t'avancer.. wacko.gif
Sammuel
CITATION(flux37 @ jeudi 8 juin 2006, 15h52) *
Je voudrais habiller mon formulaire pour qu'l ne déforme plus la cellule et soit de la meme largeur que mon champ de texte..

Est ce que tu pourrais préciser ce point ? car je ne comprends pas du tout quel est ton problème whistling.gif
flux37
bonjour,

Excuses ma lenteur..
Le problème vient tout simplement du fait que lorsque j'insère un formulaire +champ texte dans une cellule de tableau, ça la déforme en hauteur.. Le formulaire crée un espace sous le champ texte que je ne sais comment supprimer..
Est-il possible de donner unehauteur fixe au cellule du tableau , ou alors au formulaire ?

J'espère avoir été +claire wink.gif
captain_torche
Essaye en CSS, avec :
CODE
form {
padding: 0;
margin: 0;
}


[Mode Gros Bourrin]Y'a de ça quelques années, quand la sémantique et le respect des normes établies n'avait aucun sens pour moi (et pas plus pour mes collègues), qu'on n'utilisait le CSS que pour du span class="titrevert" tout en trouvant ça génial, et qu'on faisait en tabulaire parce qu'on savait pas faire autrement, on utilisait l'astuce suivante :
CODE
<table>
<form>
<tr>
<td> ... </td>
</tr>
</form>
</table>
flux37
oki merci pour ta réponse wink.gif

aurais -tu une solution me permattant de faire sans tableaux ?? Je serai tout à fait interessée par la perspective de passer de l'ère préhistorique à notre ère.. wink.gif


Je n'ai juste utilisé le tableau pour des données tabulaires et il se trouve que dans certaines cellules je veux y insérer un champ.. Je ne pensais pas que cela ne se faisait plus... rolleyes.gif
Que m'aurais tu conseillé ? une liste ?

bien à toi,

flux37
Dudu
Salut smile.gif
CITATION(flux37 @ lundi 19 juin 2006, 21h20) *
aurais -tu une solution me permattant de faire sans tableaux ?? Je serai tout à fait interessée par la perspective de passer de l'ère préhistorique à notre ère.. wink.gif
Je n'ai juste utilisé le tableau pour des données tabulaires et il se trouve que dans certaines cellules je veux y insérer un champ.. Je ne pensais pas que cela ne se faisait plus... rolleyes.gif
Que m'aurais tu conseillé ? une liste ?

bien à toi,

flux37
Pour ma part, je te conseille l'excellent article du non-moins excellent Web Standards Project (WaSP pour les intimes):
Acccessible HTML/XHTML Forms

L'apprentissage est indolore, et progressif:
Niveau débutant
Niveau intermédiaire
Niveau avancé

Seul un léger niveau d'anglais est requis, quoique les exemples et les bouts de code peuvent se suffire à eux-mêmes wink.gif

Aussi bon que ça mais en français, je ne connais pas (d'ailleurs une traduction serait une bonne idée si cela n'a pas déjà été fait..)
captain_torche
Ca pourrait m'intéresser, encore faudra-t'il voir si j'ai suffisamment de temps wink.gif

[Edit]Tu te couches tard !
flux37
Bonjour,

Merci pour ce lien .. formulaires accessibles dans un tableau.. tout ce kil me fallait wink.gif

à bientôt,

fllux37
Dudu
CITATION(flux37 @ mardi 20 juin 2006, 08h58) *
Merci pour ce lien .. formulaires accessibles dans un tableau.. tout ce kil me fallait
Dans un premier temps, ça parle de tableau. Mais progressivement l'article conseille de ne pas en mettre et donne des pistes pour savoir y faire.
Et je conseille aussi fortement d'éliminer les tableaux pour ce type de contenu non-tabulaire.

Mais enfin si tu as pu trouver ton bonheur c'est déjà ça..
(attention au langage SMS tout de même..)

CITATION(captain_torche @ mardi 20 juin 2006, 08h02) *
[Edit]Tu te couches tard !
Et pourtant "se coucher tard nuit" (M. Raymond Devos) ..
TheRec
Il y a justement un article qui a été publié aujourd’hui sur A List Apart : Prettier Accessible Forms
Je pense que son auteur à du t'entendre penser très fort wink.gif Non c'est un problème récurrent... quoi que personnellement je trouve qu'un tableau est acceptable d'un point de vue sémantique pour structurer un formulaire. Car tu présente un liste de champs (<td> datas) à chaque fois en rapport avec un intitulé (<th> header)... mais si tu as la possibilité d'éviter un tableau superflu, on peut tout à fait considérer que sémantiquement ton formulaire est une suite (logique ou non...dans l'article en question je ne comprends pas pourquoi il tient à utiliser une <ol> ... les champs n'ont pas d'ordre "logique" à part celui qu'il veut bien leur donner...enfin c'est un détail à ce niveau) de champs avec chacun un intitulé (<label>).

La partie Javascript de cet article est intéressante dans la mesure où elle ne nuit pas vraiment à l'accessibilité de ton formulaire wink.gif Par contre je suis moins intéressé par la partie CSS Hacks, c'est vraiment une manie que je ne comprendrais jamais...il n'y a pas mieux pour tuer la durée de vie d'une page wink.gif
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.