Solucionado (ver solução)
Solucionado
(ver solução)
6
respostas

[Dúvida] align-self não funciona

O "align-self: center;" não alterou o layout da página. Alguém sabe me explicar o porquê? Imagem do código CSS e da página em tamanho de mobile

6 respostas
solução!

Na parte 2:07 ele faz um corte de edição, durante esse corte repare que na linha 27 ele adiciona a propriedade height: 100%; dentro do menu__lista. Sendo assim o código tem que ficar:

.menu__lista{
    display: flex;
    justify-content: space-around;
    height: 100%;
}

.menu__lista li{
    align-self: center;
}

Agora funcionou certinho, muito obrigada!

Poderiam ter avisado desse corte de edição... O meu também não estava funcionando

alguém consegue explicar o pq não funciona sem o height: 100% ?

Não funciona porque a o menu__lista não está sendo aplicado a todo o espaço do container pai, então ele não tem os mesmos 74px de altura do menu__container. Quando define-se a altura como 100% ele tem acesso a toda altura do menu__container, usando esse espaço a partir dai para alinhar os item na vertical.

Obrigado! eu não tinha percebi que houve um corte na edição rsrs.