Css
@media (max-width: 1200px) {
.cabecalho {
padding: 10%;
}
.cabecalho__menu {
justify-content: center;
}
.apresentacao {
flex-direction: column-reverse;
padding: 5%;
}
.apresentacao__conteudo {
width: auto;
}
Oi, Estanislau! Como vai?
Obrigada por compartilhar seu código com a comunidade Alura.
Gostei da forma como você implementou a responsividade, garantindo que os elementos se reorganizem bem em telas menores. O uso de flex-direction: column-reverse; na .apresentacao é uma ótima estratégia para priorizar a exibição da imagem.
Para saber mais:
Ao utilizar media queries para criar um layout responsivo, é importante garantir que os espaçamentos e direções dos elementos estejam otimizados para diferentes tamanhos de tela.
Quer aprender mais sobre como estruturar layouts responsivos? Confira este artigo:
Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!