1,「margin:0 auto」

ブロック要素の中央揃えの方法１つ目は「margin:0 auto」にすることです。

See the Pen css-1 by 近野智優 (@bplqliga-the-bashful) on CodePen.

どういう時にこの方法を使うかというと「中央揃えにしたい要素が一番外側の枠の時」ですかね。一番外側のdivやulなどを中央揃えにしたい場合はこちらがかなり使いやすいですが、その中に包容されている要素（divの中のdivなど）の場合は次に説明する方法を使った方がいいです。

2,「display:flex」

ブロック要素の中央揃えの方法2つ目は「display:flex」にすることです。

See the Pen css-2 by 近野智優 (@bplqliga-the-bashful) on CodePen.

「display:flex」は親要素であるflexboxの中に包容されているflexitemに対してコードが適応されます。中央揃えの場合、flexboxの中央にflexitemが配置されるような形です。なので親要素となる枠が必ず必要になります。それさえあればほとんど「display:flex」で解決できるので基本的にこちらを使うことが多いです。

ちなみにこれは要素が単体でも問題なく適応されます

See the Pen css-3 by 近野智優 (@bplqliga-the-bashful) on CodePen.

そして「display:flex」は配置系のcssでは超万能であり、中央揃えだけでなく他にも色々な並び方ができるので絶対にマスターしてください！

「display:flex」の使い方マニュアルはこちらの記事で紹介していますのでぜひ参考にしてみてください。

Ninja Formsの基本的な使い方、カスタマイズ方法！

https://konno-web.info/blog_post/test12

1,「text-align:center」

インライン要素の中央揃えの方法は「text-align:center」にすることです。

See the Pen css-4 by 近野智優 (@bplqliga-the-bashful) on CodePen.

はい、とても簡単です。例えばdivをインライン要素にした場合にもこれで中央揃えにすることができます。