Para alinhar ao centro o menu e a logo, foi indicado que a imagem teria 220px, por isso o topo do menu deveria ter 110px:
nav {
position: absolute;
top: 110px;
right: 0;
}Há alguma forma de realizar esse alinhamento de forma automática?
Supondo que não sabemos o tamanho da imagem ou ela é alterada constantemente, não se torna trabalhoso realizar esse ajuste manualmente?
Dá uma pesquisada sobre flex-box. Com position relative e absolute é um pouco complicado mesmo.
Aplicando 'display: flex' no elemento pai (no caso da aula, se eu não me engano, seria a div com a classe menu), todos os elementos filhos ficam um ao lado do outro (no caso a logo e o menu ficariam lado a lado).
Para alinha-los sempre ao centro, também no elemento pai seria aplicado:
.menu {
display: flex; /* Coloca os elementos-filhos um ao lado do outro */
align-items: center; /* Alinha os elementos filhos ao centro verticalmente */
justify-content:center; /* Alinha os elementos filhos ao centro horizontalmente */
}