画面上から50%左から50%の位置に要素配置する
<divclass="box"><h1>BOX</h1></div>.box{position:absolute;top:50%;left:50%;}See the Pen WNNPrGr by YoKa@Powder (@YoKa_Powder) on CodePen.
分かりやすいように中央線を入れています。
要素の中心座標を縦横50%ずらす
要素のcssに以下のコードを加える。
.box{transform:translate(-50%,-50%)}See the Pen jOOdWyr by YoKa@Powder (@YoKa_Powder) on CodePen.