【CSS】左右中央寄せ（ブロック要素、インライン要素、インラインブロック要素）

margin: 0 auto;

ブロック要素を左右の中央寄せ（まんなか）にする
必ずwidthを指定する

この赤いブロック要素をまんなかに表示したい。

例.html

<p>左右のまんなか</p>

例.css

p {
  background-color: red;
  color: white;
  width: 300px;
  margin: 0 auto;
}

CSSの一番下に margin: 0 auto; をコーディング。

Web
↓

左右のまんなかに表示されました！
注意事項としては必ず width で幅を指定しないとダメです。

text-align: center

インライン要素、インラインブロック要素を左右の中央寄せ（まんなか）にする

詳しくは 【CSS】text-align の text-align: center; をご参考ください

まとめると・・・

ブロック要素	インライン要素	インラインブロック要素
margin: 0 auto;	text-align: center	text-align: center

となります