Después de luchar con el componente Imagen de Next.js y, finalmente, hacerme cada vez más amigo de él, tengo un problema final que parece que no puedo resolver.

Cuando visito mi página en un teléfono móvil, teniéndola en posición vertical (en modo vertical), las imágenes se muestran correctamente, llenando el ancho máximo disponible. Todo está bien hasta ahora. Ahora, cuando giro mi teléfono 90 grados, cambiando al modo horizontal, todo mi CSS cambia de acuerdo con mis consultas de medios, pero las imágenes permanecen en el mismo tamaño que cargaron originalmente. Por lo tanto, no llena el ancho máximo disponible ahora. Al actualizar, se representan correctamente.

Además, en el emulador de teléfono Chrome Dev Tool, todo funciona como se esperaba. Cuando cambio la orientación, inmediatamente cambia el tamaño de la imagen en consecuencia.

Avíseme si necesita alguna parte de mi código, ¡espero saber de usted!