EXERCÍCIO: Como podemos fazer com que o menu fique do lado direito e o logo do lado esquerdo no seguinte código?
<header class="cabecalho">
<a class="logo" href="#">
<img src="img/logo.png">
</a>
<ul class="menu">
<li class="menu-item">Item 1 do menu</li>
<li class="menu-item">Item 2 do menu</li>
<li class="menu-item">Item 3 do menu</li>
<li class="menu-item">Item 4 do menu</li>
</ul>
</header>RESPOSTA: Usando display: flex, align-items: center, justify-content: space-between, como abaixo:
<style>
.cabecalho {
display: flex;
align-items: center;
justify-content: space-between;
}
</style>