Centrer <body> en css

Résolu/Fermé

julow Messages postés 2198 Date d'inscription dimanche 26 août 2007 Statut Membre Dernière intervention 7 juillet 2015 - 2 déc. 2007 à 21:00
Jessicat322 Messages postés 60 Date d'inscription vendredi 19 février 2010 Statut Membre Dernière intervention 18 juin 2013 - 19 févr. 2013 à 21:33

Bonjour,
je cherche le moyen de centrer une div avec le CSS. J'ai trouvé ca sur le net mais ca marche pas (sinon je ne serais pas là!!) :

body {
background-color:#000000 ;
position: absolute;
margin-left:auto; | apparement ces 2 lignes sont sencées centrer mon body à condition d'avoir donné la largeur (ce que j'ai fait)
margin-right:auto; |
width:900px;
text-align:center;
}

Quelqu'un peut il me donner la solution?

A voir également:

Css body center
Dans le document, léa a utilisé 2 méthodes différentes pour centrer le nom des continents. lesquels sont centrés correctement ? - Meilleures réponses
Centrer body css - Meilleures réponses
Etd control center - Forum Windows 8 / 8.1
Control center - Télécharger - Divers Utilitaires
Copytrans control center - Télécharger - Divers Utilitaires
Family center snapchat - Guide
Catalyst control center - Télécharger - Pilotes & Matériel

5 réponses

Réponse 1 / 5

9uigui Messages postés 6 Date d'inscription lundi 4 janvier 2010 Statut Membre Dernière intervention 5 septembre 2011 19
30 avril 2010 à 18:51

Boujour,

Chez moi :

body{ margin: 0 auto; } ou body{ margin: auto; } ne fonctionne pas sous IE8, FF/MOZ ou Chrome !

Par contre :
body{ text-align: center; } fonctionne sous IE8 mais pas avec les autres navigateurs.

J'ai résolu mon problème avec la balise <center> :
<body><center> ... </center></body>

abfab
8 mars 2012 à 00:21

Bravo ! pour la balise <center>. J'ai fais tous les forums. J'ai eu des explications ou des solutions alambiquées...
Et là, c'est la première réponse, simple et claire..
Félicitations

navugo
3 juin 2012 à 20:12

pour centrer le <body>..</body> de votre page HTML, il faut en CSS définir la taille, puis les marges (ici automatique), la taille n'est donnée qu'à titre indicatif :
body {
width: 800px;
margin: auto;
}

Moa
19 juil. 2012 à 13:55

Non valide W3C HTML4 strict....

Réponse 3 / 5

heycraft
3 janv. 2010 à 17:14

Bonjour, je tombe sur ce sujet qui m'a un peu aider a centrer mon body.

On peut donc declarer une taille à un body, puis attribuer la valeur auto aux margin-left et margin-right. Cela ma centrer mon body et la taille et apparement la bonne.

Merci

midiweb
10 févr. 2010 à 22:41

j'ai le même prob, comment centrer tout mon site á la fois sur les écrans 4.3 et 16:9. J'ai essayer:

body {
position: absolute;
margin: 0, auto;
padding: 0px;
width: auto;
height: 100%;
display: block;
}

Mon site reste centré à gauche

Axion
15 déc. 2010 à 11:18

midiweb ton problème a été sité plus

Il faut enlevé le "position absolute" cela bloque ton site en haut à gauche sinon avec le reste cela devrais fonctionné

Navid_92 Messages postés 711 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 12 février 2015 87
3 juin 2012 à 20:44

Déjà tu met un width auto, or pour que le bloc se centre il faut lui fixer une taille.
Le position absolute te positionne au point top:0; left:0 (en haut à gauche).

Corrigons ton code maintenant:

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Demo</title>
  <style>
      html,body{height:100%;margin:0;padding:0;text-align:center}
      #global{background:#555;margin:0 auto;min-height:100%;text-align:left;width:960px}
      * html #global{height:100%}
  </style>
</head>

<body>
  <div id="global">
    Demo
  </div>
</body>
</html>

Jessicat322 Messages postés 60 Date d'inscription vendredi 19 février 2010 Statut Membre Dernière intervention 18 juin 2013 6
2 août 2012 à 19:35

Il y a moyen que ce soit compatible avec Explorer (la dernière version) et Firefox (toujours la dernière version) ? Parce que si un accepte, l'autre pas forcément.

Tyschow
Modifié par Tyschow le 11/01/2013 à 11:46

La solution que j'utilise pour ma part est de tout dans une balise <div id="page"> et pour le css :
#page {
width: ...px; /* ou width:...%; ou width:...em; au choix, mettez la largeur de votre page*/
margin-left: auto;
margin-right: auto;
}
Pour un alignement vertical au centre, même principe
#page {
height: ... ; /*hauteur de votre page */
margin-top: auto;
margin-bottom: auto;
}

Pour les deux en même temps :
#page {
height: ... ; /* hauteur de votre page */
width: ... ; /* largeur de votre page */
margin: auto;
}

Tout est là :
http://edu.ca.edu/css-centrer-une-page-dans-la

Discussions similaires

Centrer body et background en CSS, sans largeur fixe

La version francaise de VISIBLE BODY 3D

facebook profil sans etre ami

Connaitre la date d'une photo.

Voir les photos de profil sans être ami?

notice français montre connectée

Discussions similaires

Newsletters