1
resposta

[Sugestão] Sugestão para alinhar os ícones ao texto

Meu ícones da barra lateral ficaram muito grandes, assim que utilizei:

.lista-links li a img {
    width: 40px;
}

Eles ficaram desalinhados, caso isso ocorra com alguém, sugiro que adicione um align-items:

.lista-links li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--secondary-color);
    font-size: 22px;

}

Assim a sua barra lateral ficará mais próxima do figma:

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

1 resposta

Oi Esther,

Excelente sugestão! 👍

O uso de align-items: center no container flex é a solução ideal para centralizar os ícones verticalmente em relação ao texto, especialmente quando o tamanho dos ícones é alterado. 💪

Sua dica é muito útil para quem estiver enfrentando esse problema. 💎

Para saber mais: Conceitos básicos de flexbox

Continue compartilhando suas descobertas! 😎