html - コンテナ内のcssセンターdiv?

Question

この HTML コードは動作します:

<div class="MyContainer" align="center">
    <div>THIS DIV IS CENTERED</div>
</div>

しかし、コンテナのcssで次のようにしたいと思います:

.MyContainer{
    align: center;
}

したがって、すべてのコンテナは div を中央に配置します。

Answer 1

text alignの CSS プロパティは、インライン DOM 属性とは異なり、text-align呼び出されます。align

---

ブロック要素( div、p、など) 自体を中央に配置する場合はul、幅を設定し、水平マージンを に設定する必要がありますauto。

たとえば、次のコードは、MyContainerクラスを持つ要素内のすべての div を親のサイズの 80% にし、コンテナーの中央に配置します。

.MyContainer div {
    margin: 0 auto;
    width: 80%;
}

コードスニペット

div {
    border: 2px solid black;
    margin: 10px;
}

.MyContainer div {
    margin: 10px auto;
    width: 80%;
}

.centered {
  text-align: center;
}

<div class="MyContainer">
    <div>Inner DIVs are centered
        <div class="centered">Here the text is also centered</div>
    </div>
</div>