¡Hola Uriel! Gracias por compartir tu duda con nosotros. Por lo que puedo ver en la imagen que compartiste, parece que el problema puede estar en la forma en que estás aplicando el media query. Si solo estás cambiando el ancho de la clase .principal y no de los elementos dentro del section, es posible que los estilos no se estén aplicando correctamente.
Una solución podría ser aplicar el media query a los elementos dentro del section en lugar de solo a la clase .principal. Por ejemplo, puedes intentar algo como esto:
@media screen and (max-width: 768px) {
.principal h1 {
font-size: 24px;
}
.principal section {
display: flex;
flex-direction: column;
align-items: center;
}
}
Esto cambiará el tamaño del título principal y aplicará los estilos de flexbox al section cuando la pantalla tenga un ancho máximo de 768px.
Espero que esto te ayude a resolver tu problema. ¡Buenos estudios!
Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios! :)