Вертикальное выравнивание содержимого слева направо внутри элемента DIV. ⇐ CSS

[Anonymous]

Я не являюсь фронтенд-разработчиком и пытаюсь создать очень простой скелет страницы, который на данный момент выглядит следующим образом:


Логотип имеет ту же высоту, что и div заголовка, а все, что справа, представляет собой обычный текст. Я хочу выровнять слова «Технологические партнеры SYNGERY» по вертикали посередине. Я также не знаю, что произошло бы, если бы будущее содержимое было выше заголовка.
У меня такое ощущение, что использование простых последующих элементов span — неправильный путь. Есть ли лучший способ структурировать его? Я бы предпочел не создавать целое изображение только для этого.
Я также предпочел бы держаться подальше от абсолютного позиционирования, если это не рекомендуется.
Для ясности вокруг заголовка div имеется рамка шириной 5 пикселей, и я максимально упростил HTML/CSS.

Код: Выделить всё

[url=Index.html]
[img]Assets/Brand/Logo.png[/img]
 
SYNERGY
 
TECHNOLOGY PARTNERS
[/url]

[url=Index.html]HOME[/url]
HOME
[url=Contact.html]CONTACT[/url]







* { margin: 0px; padding: 0px; }
body { height: 100%; max-height: 100vh; font-family: Arial, Helvetica, sans-serif; border-color: black; background-color: white; }
a { color: #0E2841; text-decoration: none; }
div { text-align: justify; }

#DivHeader
{
height: 80px;
color: white;
background-color: #0E2841;
vertical-align: middle; /* This is perhaps the problem? */
}
#DivHeader a { color: white; }

#DivMain { background-color: white; }
#DivMenu { }
#DivBody { }
#DivFooter { }

.Logo { font-family: "Gugi", sans-serif; font-weight: 400; font-style: normal; font-size: 36px; }

Я осмотрелся и нашел всевозможные способы, но не нашел ничего, что я мог бы понять. Любые указатели будут оценены.

Подробнее здесь: https://stackoverflow.com/questions/790 ... iv-element