Centrer un formulaire
Résolu
alejandrom
-
alejandrom -
alejandrom -
Bonjour,
Ma question peut paraître bête mais je n'arrive pas à centrer mon formulaire ! Il est en fait aligné à gauche.
Voici mon code :
<form method="post" action="traitement.php">
<p><label for="pseudo">Pseudo</label><br/>
<input type="text" name="pseudo" id="pseudo" tabindex="1"/></p>
<p><label for="mail">E-mail</label> <br/>
<input type="text" name="mail" id="mail" tabindex="2"/></p>
<p><label for="reaction">Réaction</label><br/>
<textarea name="reaction" id="reaction" rows="10" cols="50" tabindex="3"></textarea></p>
<p>
<input type="submit" />
</p>
</form>
J'ai essayé d'appliquer un text-align à form et à p mais ça n'a pas marché (j'étais pas vraiment surpris mais je pensais que ça centrerait au moins le <label>).
J'ai aussi essayé une balise <center> (oui, je sais, c'est pas bien de l'utiliser celle-là) pour englober mon <form> mais (et là, j'étais vraiment surpris) ça n'a pas marché.
Quelqu'un pourrait m'aider ? Je précise que je veux centrer et le <label> (Pseudo, E-Mail) et le champ de texte. Merci d'avance, c'est la dernière étape avant que je finisse mon site :)
Ma question peut paraître bête mais je n'arrive pas à centrer mon formulaire ! Il est en fait aligné à gauche.
Voici mon code :
<form method="post" action="traitement.php">
<p><label for="pseudo">Pseudo</label><br/>
<input type="text" name="pseudo" id="pseudo" tabindex="1"/></p>
<p><label for="mail">E-mail</label> <br/>
<input type="text" name="mail" id="mail" tabindex="2"/></p>
<p><label for="reaction">Réaction</label><br/>
<textarea name="reaction" id="reaction" rows="10" cols="50" tabindex="3"></textarea></p>
<p>
<input type="submit" />
</p>
</form>
J'ai essayé d'appliquer un text-align à form et à p mais ça n'a pas marché (j'étais pas vraiment surpris mais je pensais que ça centrerait au moins le <label>).
J'ai aussi essayé une balise <center> (oui, je sais, c'est pas bien de l'utiliser celle-là) pour englober mon <form> mais (et là, j'étais vraiment surpris) ça n'a pas marché.
Quelqu'un pourrait m'aider ? Je précise que je veux centrer et le <label> (Pseudo, E-Mail) et le champ de texte. Merci d'avance, c'est la dernière étape avant que je finisse mon site :)
A voir également:
- Centrer un formulaire css
- Whatsapp formulaire opposition - Guide
- Formulaire de réclamation facebook - Guide
- Formulaire de reclamation instagram - Guide
- Formulaire de contact le bon coin introuvable ✓ - Forum Réseaux sociaux
- Confirmer le nouvel envoi du formulaire err_cache_miss - Forum Google Chrome
4 réponses
Yo, il n'y a pas de question bête ;)
C'est vrai que ça à l'air bizarre pour la balise <center>, peut être à voir avec le doctype ou alors une classe ou id css qui s'applique et à le dernier mot.
Avez vous vidé le cache du navigateur avant d'actualiser?
Essayez plutôt d'appliquer le text-align à la balise de paragraphe qui contient le label, text-align étant pour du texte si vous la mettez au <label> vous allez centrer le texte du label uniquement.
J'ai l'habitude de rajouter un div contenant le form pour le css, ça peut paraître surcharger pour rien mais je trouves plus propre de laisser que la method et action en attributts de balise form.*
<div style="text-align:center;padding-left:0.25em;padding-right:0.25em;"><!-- enfin plutôt avec une classe hein -->
<form>
...
</form>
</div>
Une autre saloperie qui m'est arrivée c'est une ligne css fausse(; manquant ou symbole en plus à cause d'une faute de frappe) et forcément quand on rafraîchit ça appliques pas le css.
C'est vrai que ça à l'air bizarre pour la balise <center>, peut être à voir avec le doctype ou alors une classe ou id css qui s'applique et à le dernier mot.
Avez vous vidé le cache du navigateur avant d'actualiser?
Essayez plutôt d'appliquer le text-align à la balise de paragraphe qui contient le label, text-align étant pour du texte si vous la mettez au <label> vous allez centrer le texte du label uniquement.
J'ai l'habitude de rajouter un div contenant le form pour le css, ça peut paraître surcharger pour rien mais je trouves plus propre de laisser que la method et action en attributts de balise form.*
<div style="text-align:center;padding-left:0.25em;padding-right:0.25em;"><!-- enfin plutôt avec une classe hein -->
<form>
...
</form>
</div>
Une autre saloperie qui m'est arrivée c'est une ligne css fausse(; manquant ou symbole en plus à cause d'une faute de frappe) et forcément quand on rafraîchit ça appliques pas le css.
Bonjour :)
J'ai réessayé <center> en vidant le cache en vain..
J'avais déjà essayé d'appliquer un text-align au <p> qui contenait mon <label> et ça n'avait toujours rien donné.
Et j'ai vérifier, pas de ligne CSS fausse :)
_
J'ai essayé de voir quel paramétrage CSS aurait pu interférer et il se trouve que le div où se trouve mon form a : width:650px; padding:20px; (j'ai aussi une margin:auto; à mon <body> entier).
Une incidence ?
J'ai réessayé <center> en vidant le cache en vain..
J'avais déjà essayé d'appliquer un text-align au <p> qui contenait mon <label> et ça n'avait toujours rien donné.
Et j'ai vérifier, pas de ligne CSS fausse :)
_
J'ai essayé de voir quel paramétrage CSS aurait pu interférer et il se trouve que le div où se trouve mon form a : width:650px; padding:20px; (j'ai aussi une margin:auto; à mon <body> entier).
Une incidence ?
