Centrer mon formulaire html avec css

[Fermé]
Signaler
-
Messages postés
3538
Date d'inscription
jeudi 15 mai 2008
Statut
Membre
Dernière intervention
11 septembre 2016
-
Bonjour,



Voila j ai creer un formulaire en html avec mise en forme css tout est nickel (couleurs, polices ...) sauf le centrage des mes blocs textes et images tout est a gauche j ai tente de mettre des valeurs avec margin, width mais rien n'y fait avez vous une idée ? voila mon fichier css pour plus dinfos merci beaucoup

#global {
position: absolute; /* on positionne le conteneur */
margin-left: auto;
margin-right: auto;
width: ...;
text-align: left;
}

p.titre {
background:#0AA6E1;
padding:.2em .3em;
font-size:1.2em;
border:2px outset #DED983;
position:relative;
margin-bottom:-1em;
width:10em;
margin-left:1em;
margin-top:1em;
}

fieldset {
border:none;
margin-bottom:1em;
width:24em;
padding-top:1.5em;
}

select {
margin-left:9em;
margin-bottom:0;
}

/* fieldset coordonnees */
fieldset#coordonnees {
background:#0AA6E1;
border:outset #0AA6E1;
}

#coordonnees label {

position:absolute;
font-size:90%;
padding-top:.2em;
left:20px;
}

#coordonnees input {
margin-left:9em;
line-height:1.4em;
margin-bottom:.2em;
}

/* fieldset message */
fieldset#message {
background:#0AA6E1;
border:outset #0AA6E1;
}

#civilite {
font-size:90%;
}

#civilite input {
margin-left:9em;
}

/* zone de texte du message */
textarea {
font:.8em "Trebuchet MS", Verdana, sans-serif;
width:29em;
padding:.2em;
}

/* les boutons submit et reset */
input[type="submit"], input[type="reset"] {
background:#0AA6E1;
font:1.2em "Trebuchet MS", Verdana, sans-serif;
color:#345071;
}

p#buttons {
text-align:center;
}
A voir également:

1 réponse

Messages postés
3538
Date d'inscription
jeudi 15 mai 2008
Statut
Membre
Dernière intervention
11 septembre 2016
464
Si tu centre avec margin, enlève le position:absolute;

Met plutôt:
#global {
margin: 10px auto 0px auto;
width: 900;
text-align: left;
} 

C'est un exemple.
Le margin que j'ai mis est décomposé de la manière suivant:
margin: haut droit bas gauche;

La même chose avec un position:absolute;
#global {
position:absolute;
margin-left: -450px;
width: 900;
top:10px;
left:50%;
text-align: left;
} 


Tu devrai avoir le même résultat dans les deux cas.
3
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 41713 internautes nous ont dit merci ce mois-ci