@media(min-width: 834px){
.menu__container{
left: 0;
height: auto;
width: 74px;
top: 80px;
}
.menu__lista{
flex-direction: column;
justify-content: flex-start;
gap: 33px;
padding-top: 15px;
}
}
Solucionado
@media(min-width: 834px){
.menu__container{
left: 0;
height: auto;
width: 74px;
top: 80px;
}
.menu__lista{
flex-direction: column;
justify-content: flex-start;
gap: 33px;
padding-top: 15px;
}
}
hoje, com a Alura e o Google Gemini
Oii Nathan, tudo bem?
Ótimo trabalho!
Seu código para o menu lateral em telas de tablets tá bem organizado e eficiente. Você utilizou corretamente a regra @media para aplicar estilos específicos quando a largura da tela é igual ou superior a 834px, o que é uma abordagem adequada para criar um design responsivo.
As propriedades que você definiu para a classe .menu__container garantem que o menu seja posicionado corretamente e tenha a altura e largura adequadas para dispositivos de tela maiores, enquanto a classe .menu__lista foi estilizada de forma apropriada para apresentar os itens do menu de maneira vertical e espaçada.
Continue praticando e explorando as possibilidades do CSS para criar layouts responsivos de alta qualidade. Parabéns mais uma vez e continue assim!
Um abraço e bons estudos.