CSSで水平と垂直の中央揃えをする方法

CSSで要素の水平・垂直方向の配置を指定するには、以下の方法があります。

1. 水平方向に並べる：

1. text-alignプロパティは、要素内テキストの水平位置を指定します。利用可能な値は次のとおりです。
2. 左寄せ
3. 右寄せ
4. 中央揃え
5. 両端揃え
6. 左右のマージンを自動に設定することで、要素を中央揃えに自动的に配置できます。

1. 垂直方向に揃える

1. vertical-alignプロパティは、要素の垂直方向の配置を設定します。使用可能な値は次のとおりです。
2. 基準線：ベースラインに揃える
3. 上寄せ
4. 中央揃え
5. 下寄せ
6. テキスト上揃え
7. テキストの配置：下揃え
8. 行の高さを決定するline-heightプロパティを使用し、同じ高さの値に設定することで垂直中央揃えを実現できます。
9. displayプロパティをtable-cellやflexなどに設定し、align-itemsとjustify-contentプロパティを組み合わせることで、縦横のセンタリングを実現できます。

特定の要素にのみ適用されるプロパティがあることに注意してください。例えば、vertical-align プロパティはインライン要素とテーブルセルにのみ適用できます。text-align プロパティはブロック要素にのみ適用できます。