Я знаю, это старое задание, но ... мне нужно учиться, чтобы сделать это.
Один для чего-то вертикально по центру, один для вертикально и горизонтально:
.h-centered-item {
position: absolute;
top: 50%;
transform: translate(0, -50%)
}
.vh-centered-item {
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%)
}
Просто примените его к элементу, который вы хотите центрировать по вертикали, или к обоим