Centrer <body> en css

Résolu

julow Messages postés 2198 Date d'inscription Statut Membre Dernière intervention -
Jessicat322 Messages postés 60 Date d'inscription Statut Membre Dernière intervention - 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:

Center body css
Html center body - Meilleures réponses
Centrer avec css - Meilleures réponses
Etd control center - Forum Windows 8 / 8.1
Control center 4 - Télécharger - Divers Utilitaires
Copytrans control center - Télécharger - Divers Utilitaires
ETD Control Helper dans System32 - Dois-je le supprimer ? - Forum Virus
Catalyst control center - Télécharger - Pilotes & Matériel

5 réponses

Réponse 1 / 5

9uigui Messages postés 6 Date d'inscription Statut Membre Dernière intervention 19

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

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

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

Non valide W3C HTML4 strict....

Réponse 3 / 5

heycraft

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

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

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 Statut Membre Dernière intervention 87

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 Statut Membre Dernière intervention 6

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

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

Condition en CSS sur une classe

obtenir les codes html/CSS d'une page web

indice et exposant en css ?

CSS: Alignement d'une liste <ul>

[CSS] Augmenter le nombre de fps

Bordures de texte en HTML CSS

Votre réponse

Discussions similaires