Tout un problème "simple" ici et je ne sais pas pourquoi c'est si compliqué.Div Centre dans un autre (100% de largeur) div
Toutes les idées? :)
.parent { text-align: center; }
.parent > .child { margin: 0 auto; width: 900px; }
Il me manquait le texte-aligner il semble comme j'avais la marge et ne fonctionnait pas. Accepté, bravo. –
text-align: le centre n'aide pas à centrer le div interne. – Vizjerai
centre la substance (texte) à l'intérieur, ce qui entraîne le même résultat souhaité (si vous avez seulement du texte). Pour que la marge automatique fonctionne, vous avez également besoin d'une largeur sur la div interne. – geowa4
Le style ci-dessous à la div intérieure va le centrer.
margin: 0 auto;
Il suffit d'ajouter margin: 0 auto; à la div à l'intérieur.
La clé est la marge : 0 auto; sur la div interne. Une preuve de concept exemple:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<body>
<div style="background-color: blue; width: 100%;">
<div style="background-color: yellow; width: 940px; margin: 0 auto;">
Test
</div>
</div>
</body>
</html>
C'est une bonne réponse car il est crucial d'avoir le bon type de doc si vous utilisez la marge: 0 auto technique – ScottE
pour information de détail, disons que le code ci-dessous fera un centre aligné div:
margin-left: auto;
margin-right: auto;
ou utilisez simplement:
margin: 0 auto;
mais Gardez à l'esprit que le code CSS ci-dessus ne fonctionne que lorsque vous spécifiez une largeur fixe (pas 100%) sur votre élément html. de sorte que la solution complète pour votre question serait:
.your-inner-div {
margin: 0 auto;
width: 900px;
}
Ceci est un bon exemple parce que vous signalez explicitement qu'une largeur sur la div interne est nécessaire. –
.outerdiv {
margin-left: auto;
margin-right: auto;
display: table;
}
ne fonctionne pas dans Internet Explorer 7 ... mais qui se soucie?
duplication possible de [Comment centrer DIV en DIV?] (Http://stackoverflow.com/questions/114543/how-to-center-div-in-div) – slugster