Ajustando o espaçamento para telas menores
Problema: O conteúdo está “espremido” por causa de muito padding nas laterais.
Solução: Use media query para ajustar o padding na classe .apresentacao.
css
Copiar
Editar
@media (max-width: 768px) {
.apresentacao {
padding: 5%;
}
}
Refinando a largura do conteúdo em dispositivos menores
Problema: Mesmo com o novo padding, o conteúdo interno ainda está muito largo.
Solução: Reduza a width do .apresentacao__conteudo dentro do mesmo break point.
css
Copiar
Editar
@media (max-width: 768px) {
.apresentacao__conteudo {
width: 100%;
}
}
Dica: width: 100% permite que o conteúdo respeite o padding do pai e se ajuste ao espaço disponível.
Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!