programandoai

Exercício: navbar alinhada com flex

Transforme uma navbar solta num layout de verdade, com Flexbox.

Estudar esta lição interativa →

A .navbar no CSS do editor ainda está com display: block. Ajuste para display: flex, com justify-content: space-between e align-items: center.

.navbar precisa de display:flex (itens lado a lado, em linha), justify-content:space-between e align-items:center.
.navbar{
  display: block;
  background:#0f172a;
  padding: 14px 20px;
}
.navbar .logo{ color:#fff; }
.navbar nav{ display:inline; }
.navbar a{ color:#94a3b8; margin-right:10px; }

🧩 Este é um exercício com correção automática — abra no app para completá-lo e verificar.

← Voltar ao índice do curso