Как сделать блок всегда по центру по высоте?

Question

[DrunkMaster]

Как выровнять блок по центру https://jsfiddle.net/eqe57mk4/1/ не только по ширине, но ещ и по высоте при любом разрешении экрана, при том, что заранее высота самого блока неизвестна:
HTML

<div id="center">
    текст блока<br>
    текст блока<br>
    текст блока<br>
    текст блока
</div>

CSS

#center {
  margin: auto;
  border: 1px solid black;
	width: 20%;
}

Это возможно сделать только на CSS или нужно JS воспользоваться? Какой тогда JS должен быть? Может ссылка на урок есть хороший на эту тему у кого-то?

Answer 1

[display: block]

#center {
  border: 1px solid black;
	width: 20%; /* Ширина блока */

  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}

Answer 2

[Camaro67]

https://jsfiddle.net/eqe57mk4/2/