html выравнивание среднего текста

Question

Привет, ребята, я делаю каталог на своем сайте и хочу, чтобы текст был в самом центре, а не в центре, а не вверху. Я хочу, чтобы он был в самой середине документа

<center>
  <button href="#">Download!</button>
</center>

Answer 1

Придайте стиль CSS вашей DOM

.wrapper {
    display: table;
    margin: 0 auto;
}

.box {
  background-color: blue;
  color: white;
  text-align: center;
  vertical-align: middle;
  width: 100px;
  height: 100px;
  display: table-cell;
}

<div class="wrapper">
   <div class="box">
       Center
   </div>
</div>

Answer 2

Вы можете использовать следующее:

.box {
  width: var(--box-size);
  height: var(--box-size);
  line-height: var(--box-size);
  background: red;
  color: white;
  text-align: center;
}

:root {
  --box-size: 100px;
}

<div class="box">
  Center
</div>

Или как предложено с flexbox:

.box {
  width: var(--box-size);
  height: var(--box-size);
  background: red;
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
}

:root {
  --box-size: 100px;
}

<div class="box">
  Center
</div>