position

中央寄せ .element { position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); } 中央右寄せ .element { position: absolute; top: 50%; right: 0; transform: translate(0, -50%); } 要素をページの右端に配置 要素を垂直方向に中央に配置 top: 50% で要素の上端がページの中央になるように設定 transform: translate(0, -50%) で要素の高さの半分を上に移動し、垂直方向に中央に配置します。 right: 0 で要素を右端に寄せる 中央左寄せ .element { position: absolute; top: 50%; left: 0; transform: translate(0, -50%); } leftも同様。

transformで中央,右寄せ,左寄せにする方法