Obtenir un alignement central horizontal des éléments

Question

Comment centrer un &lt;div&gt; horizontalement à l'intérieur d'un autre &lt;div&gt; &lt;divid="extérieur"&gt;&lt;divid="intérieur"&gt;Foofoo&lt;/div&gt;&lt;/div&gt;

P粉002023326 · Answer

Si vous ne souhaitez pas définir une largeur fixe à l'intérieur div, vous pouvez essayer ceci :

#outer {
  width: 100%;
  text-align: center;
}

#inner {
  display: inline-block;
}

  
    Foo foo

Cela fera de l'intérieur div成为一个可以通过text-align un élément en ligne qui peut être centré via text-align.

P粉617597173 · Answer

Très facile de centrer les divs horizontalement et verticalement en utilisant flexbox.

#inner {  
  border: 0.05em solid black;
}

#outer {
  border: 0.05em solid red;
  width:100%;
  display: flex;
  justify-content: center;
}


  Foo foo