IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

Centrer mon formulaire


Sujet :

HTML

  1. #1
    Membre confirmé
    Profil pro
    Inscrit en
    Août 2009
    Messages
    75
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2009
    Messages : 75
    Par défaut Centrer mon formulaire
    Bonjour,
    j'ai recupérer un formaulaire de contact mais je n'arrive pas à le centrer dans ma page php.

    voici le code du formualire:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
     
    if (($err_formulaire) || (!isset($_POST['envoi'])))
    	{
    		// afficher le formulaire
    		echo '<form id="contact" method="post" action="'.$form_action.'">'."\n";
    		echo '	<fieldset><legend>Vos coordonnées</legend>'."\n";
    		echo '		<p>'."\n";
    		echo '			<label for="nom">Nom :</label>'."\n";
    		echo '			<input type="text" id="nom" name="nom" value="'.stripslashes($nom).'" tabindex="1" />'."\n";
    		echo '		</p>'."\n";
    		echo '			<p>'."\n";
    		echo '			<label for="nom">Prénom :</label>'."\n";
    		echo '			<input type="text" id="prenom" name="prenom" value="'.stripslashes($prenom).'" tabindex="2" />'."\n";
    		echo '		</p>'."\n";
    		echo '		<p>'."\n";
    		echo '			<label for="email">Email :</label>'."\n";
    		echo '			<input type="text" id="email" name="email" value="'.stripslashes($email).'" tabindex="3" />'."\n";
    		echo '		</p>'."\n";
    		echo '	</fieldset>'."\n";
     
    		echo '	<fieldset><legend>Votre message :</legend>'."\n";
    		echo '		<p>'."\n";
    		echo '			<label for="objet">Objet :</label>'."\n";
    		echo '			<input type="text" id="objet" name="objet" value="'.stripslashes($objet).'" tabindex="4" />'."\n";
    		echo '		</p>'."\n";
    		echo '		<p>'."\n";
    		echo '			<label for="message">Message :</label>'."\n";
    		echo '			<textarea id="message" name="message" tabindex="5" cols="30" rows="8">'.stripslashes($message).'</textarea>'."\n";
    		echo '		</p>'."\n";
    		echo '	</fieldset>'."\n";
     
    		echo '	<div style="text-align:center;"><input type="submit" name="envoi" value="Envoyer le formulaire !" /></div>'."\n";
    		echo '</form>'."\n";
    	};
    Y aurait il une âme charitable afin de m'aider?

    merci par avance

  2. #2
    Membre confirmé
    Étudiant
    Inscrit en
    Janvier 2010
    Messages
    73
    Détails du profil
    Informations personnelles :
    Âge : 36

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Janvier 2010
    Messages : 73
    Par défaut
    met le tout dans un DIV et centre le

  3. #3
    Membre confirmé
    Profil pro
    Inscrit en
    Août 2009
    Messages
    75
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2009
    Messages : 75
    Par défaut
    mon probleme est la fonction echo, avec qui je sais pas comment centrer le formulaire.
    J'ai déjà essayer en ecrivant :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    echo'<center>'."\n";
    echo'mon code'."\n";
    echo'</center>'."\n";
    mais ca ne marche pas, meme avec div, une idée ?

    la je cale

  4. #4
    Modérateur
    Avatar de sabotage
    Homme Profil pro
    Inscrit en
    Juillet 2005
    Messages
    29 208
    Détails du profil
    Informations personnelles :
    Sexe : Homme

    Informations forums :
    Inscription : Juillet 2005
    Messages : 29 208
    Par défaut
    Le problème n'a justement rien à voir avec echo.
    Concernant le <center> qui tu viens de tester, cela fonctionne ; ce n'est peut être pas ça que tu veux obtenir mais le texte du formulaire est bien au centre de la page.
    N'oubliez pas de consulter les FAQ PHP et les cours et tutoriels PHP

  5. #5
    Membre confirmé
    Profil pro
    Inscrit en
    Août 2009
    Messages
    75
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2009
    Messages : 75
    Par défaut
    en fait je voudrais que les fieldset soient centrés dans ma page php.

  6. #6
    Membre Expert Avatar de RunCodePhp
    Profil pro
    Inscrit en
    Janvier 2010
    Messages
    2 962
    Détails du profil
    Informations personnelles :
    Localisation : Réunion

    Informations forums :
    Inscription : Janvier 2010
    Messages : 2 962
    Par défaut
    Salut

    Théoriquement il n'y a pas besoin de rajouter un conteneur (DIV ou CENTER) pour centrer le <form>.

    Il faut se référer au W3C, qui dit que par défaut un <form> et un élément de type BLOCK, ce qui fait qu'il occupe toute la largeur du conteneur qui le contient.
    Impossible dans cette condition de le center.

    Maintenant rien nous dit que tu as redéfini tout autrement les attributs des <form> dans ta feuille de style CSS, ce qui risque de compliquer les choses.
    On va dire que que non.

    Ensuite, tu englobe dans ton <form> un autre élément de type BLOCK -> le <fieldset>.
    Rebelotte, le <fieldset> occupera lui aussi toute la largeur du conteneur qui le contient (le <form>).

    C'est pas fini ... dans ton <fieldset>, on remarque une succession de <p> qui sont eux aussi des élément de type BLOCK. Re-re-belote ...

    Enfin, chaque <p> contient cette fois des éléments de type EN LIGNE, qui eux pourront cette fois être centrés.

    Si tout ça n'a pas été redéfin tout autrement, et bien c'est dans les <p> que tu devrais rajouter un style : <p style="text-align: center">

    Pour mieux te rendre compte de l'espace qu'occupe chaque élément, le truc très simple c'est de rajouter une bordure :<form style="border: 1px solid red;">


    Normalement un élément de type BLOCK ne se centre pas (je dis bien normalement).
    Seul les éléments de type EN LIGNE peuvent être centrer.

    Pour forcer en quelque sorte le centrage d'un élément de type BLOCk car on lui aurait défini une largeur inférieur à sa largeur max (genre 80%), on peu ajouter un style du genre : <form style="width: 80%; margin: auto; border: 1px solid red">

    Fait des essais ... et si possible dans une page vierge, sans feuille de style qui pourrait perturber/modifier le comportant normal (ou par défaut) des éléments.

    Mais pour bien comprendre tout ça, il te faut apprendre les bases du HTML et CSS, comme le comportement des différents éléments : type block, en ligne, et flottant.
    Pas simple car c'est lié aux navigateurs, et certains en font un peu à leur tête

  7. #7
    Membre confirmé
    Profil pro
    Inscrit en
    Août 2009
    Messages
    75
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2009
    Messages : 75
    Par défaut
    merci RunCodePhp, j'ai réussi à créer un site, mais je bloque juste sur ça.............
    je vais faire des essais, et je vais voir, merci

Discussions similaires

  1. ie ne retrouve pas un element de mon formulaire
    Par duge dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 28/02/2006, 09h50
  2. la date et heure sur mon formulaire
    Par azde7015 dans le forum Access
    Réponses: 11
    Dernier message: 07/02/2006, 10h40
  3. centrer un formulaire sous ACCESS97
    Par Brett dans le forum Access
    Réponses: 2
    Dernier message: 19/10/2005, 14h48
  4. [Debutant(e)]mise à jour de mon formulaire via JSP
    Par kouadjalain dans le forum Servlets/JSP
    Réponses: 4
    Dernier message: 11/08/2004, 15h43

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo