Tom's Guide > Forum > Programmation > [Resolu]champs de formulaire alignés verticalement(HTML/CSS)

[Resolu]champs de formulaire alignés verticalement(HTML/CSS)

Forum Programmation : [Resolu]champs de formulaire alignés verticalement(HTML/CSS)

TomsGuide.com : 800 000 inscrits répondent à toutes vos questions high-tech et informatique. Pour obtenir de l'aide, inscrivez-vous gratuitement !
Créer un nouveau sujet Répondre
Mot :    Pseudo :           
 
Halike   31-01-2007 à 21:41:31

Bonjour à tous,
J'ai commencé la construction d'un site internet qui contient notament un formulaire qui ressemble à ca:

Code :
  1. <form action="blabla.php" method="post" id="formulaire">
  2. <fieldset id="section1">
  3. <legend>Titre1</legend>
  4. <label for="input1">Champ 1</label>
  5. <input type="text" name="input1" id="input1" />
  6. <label for="input2">Champ 2</label>
  7. <input type="text" name="input2" id="input2" />
  8. <label for="input3">Champ 3</label>
  9. <input type="text" name="input3" id="input3" />
  10. </fieldset>
  11. </form>



Le formulaire est bien sur un peu plus consequent, et possede un bouton ,de validation, mais il est structuré comme ca.
Mon probleme, c'est que les noms Champ1, champ2,... ont des longueurs differentes, et du coup, les cases du formulaire ne sont pas alignées verticalement.
J'ai cherché sur internet, et j'ai trouvé comme solution de fixer une largeur fixe pour les balises label a l'aide d'une CSS:

Code :
  1. label
  2. { width : 30px ; }


Je comprends bien l'idée, mais ca n'a pas l'air de fonctionner.
Etant un gros débutant en HTML/CSS, je patauge la dedans depuis quelques jours, sans avancer. C'est pourquoi je sollicite votre aide :).

Quelqu'un pourrait-il m'expliquer comment aligner ces satanés champs (sans utiliser des tableaux, parce que j'ai cru lire que c'était mal :) ), ou alors me filer un lien qui me fournirait une explication ?

Merci de votre aide.


Message édité par Halike le 01-02-2007 à 17:54:57
Répondre
Liens sponsorisés
Inscrivez-vous ou connectez-vous pour masquer ceci.
mousk@IDN   31-01-2007 à 21:54:40
- 0 +

Salut !

Tu peux mettre un argument "size=unNombre" dans tes balises input, cet argument défini la longueur du champs dans ta page.

Répondre à mousk@IDN
Halike   31-01-2007 à 23:00:21
- 0 +

Bonsoir,

Citation :

Tu peux mettre un argument "size=unNombre" dans tes balises input, cet argument défini la longueur du champs dans ta page.


Soit je n'ai pas compris, soit tu ne réponds pas à ma question :).
Changer la taille des champs ne va pas les faire s'aligner je crois, ou alors j'ai loupé un truc...

Une autre idée?

Répondre à Halike
Sethpolma   01-02-2007 à 13:08:27
- 0 +

Pour les formulaires, la façon la plus simple est l'utilisation d'un tableau. Et, non, ce n'est pas mal ! Pas pour présenter des données sous formes tabulaires. C'est mal si tu fais ton design avec par exemple. Mais il y a des fois où tu peux quand même les utiliser, comme dans ce cas. :-)

Répondre à Sethpolma
Halike   01-02-2007 à 17:48:42
- 0 +

Merci pour cette réponse Sethpolma:)
...Mais en fait j'ai trouvé :).

C'est de ma faute (il fallait s'en douter ;) ). En fait, comme j'ai essayé plein de trucs (je suis débutant pour ma défense...), je me suis retrouvé avec un truc comme ca:

Code :
  1. 1. <form action="blabla.php" method="post" id="formulaire">
  2.   2. <fieldset id="section1">
  3.   3. <legend>Titre1</legend>
  4.   4. <label for="input1"></label>
  5.   5. Champ 1<input type="text" name="input1" id="input1" />
  6.   6. <label for="input2"></label>
  7.   7. Champ 2<input type="text" name="input2" id="input2" />
  8.   8. <label for="input3"></label>
  9.   9. Champ 3<input type="text" name="input3" id="input3" />
  10.   10. </fieldset>
  11.   11. </form>


(notez le joli vide entre les balises label...)
Du coup, je suppose que changer la taille des label ne changeait pas grand chose.

Le probleme est donc résolu.
Merci à ceux qui m'ont proposé des solutions.
A bienot :) .

Répondre à Halike
Sethpolma   02-02-2007 à 12:54:46
- 0 +

En effet... Une erreur bête, mais qui arrive ! :-)

Répondre à Sethpolma
mousk@IDN   02-02-2007 à 17:47:15
- 0 +

dsl j'ai du mal comprendre ta question :sleep: . Sinon jusqu'à maintenant j'utilisais les tableaux pour organiser mes pages web, bon maintenant je compte me mettre à la norme w3c donc je crois qu'il faut que j'arrête :(

Répondre à mousk@IDN
Créer un nouveau sujet Répondre
Tom's Guide > Forum > Programmation > [Resolu]champs de formulaire alignés verticalement(HTML/CSS)
Aller à :

Il y a 2555 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.

Plan du forum
Forum Bestofmedia ©
2000-2009 Bestofmedia Group
Page générée en 0,763 secondes
Attention

Vous allez répondre sur un sujet resté inactif pendant plus de 6 mois.
Assurez-vous d'apporter des éléments nouveaux à la discussion avant de poursuivre.

Répondre Annuler
Liens