2
respostas

[Dúvida] A propriedade "align-items: center;" neste exercício não funcionou...

Praticando o exercício onde era solicitado que colocássemos a logo e o menu, alinhados verticalmente, no meu entendimento seria que o menu iria ficar em baixo da logo, é isso mesmo? Se sim, ao acrescentar esta propriedade eles permaneceram na posição horizontal....conforme print. Ou eu entendi errado! help! Front-end novata! :)

Print da tela com apresentando três quadros: o primeiro ao lado esquerdo com a resolução do exercício, informando o código correto, o segundo no canto superior direto o sublime amostrando o código utilizado e o terceiro no canto inferior direito a página web do Google Chrome, mostrando o resultado após atualização Olá,

2 respostas

Olá, Bom dia! acredito que vc colocou no bloco todo e talvez seja melhor colocar na tag ul da ordem da lista, acredito que isso resolva, porém também sou novo kkkk posso muito bem estar errado, vou acompanhar o post para aprender também.

Olá, nesse caso o que esta acontecendo e que o display flex esta fazendo com os itens do menu fiquem em linha que é o posicionamento padrão do display flex, para que os itens do menu fiquem em baixo da logo é necessário adicionar a propriedade flex-direction: column; no display flex.

Tem um artigo da alura que explica melhor como o flexbox ou display flex funciona vou deixa o link a baixo, vou deixar também o link de um site que tem exemplos práticos de flexbox.

Flexbox CSS: Guia Completo, Elementos e Exemplos

A Complete Guide to Flexbox

Espero ter ajudado, qualquer duvida e só chamar.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software