HTML

<!doctype html>
<html lang="ja">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>sample</title>
    <link href="style.css" rel="stylesheet">
</head>

<body>
<div class="container">
  <div class="box">あいうえお</div>
</div>
</body>

</html>

CSS

.container {
  position: relative;
  width: 100vw;
  height: 100vh;
  background-color: #99cc00;
}

.box {
  position: absolute;
  background-color: #f53838;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

top、left を 50% 指定するだけだと、boxクラス(ブロック要素)の左上角が上下中央になるので、boxクラスが中央になりません。
なので、translate を指定し、boxクラスの大きさ半分についてXおよびYの位置(左上角の位置)をずらす事で文字が中央になります。
translateについては以下を参考にして下さい。

参考

【CSS】transform translate

結果

あいうえお

最後に

特にありません。