Tengo una ventana emergente modal en mi sitio web con su altura máxima establecida en 20.625 rem. Ahora esta ventana emergente modal ya muestra una barra de desplazamiento cuando su contenido excede el valor de umbral de altura máxima de 20.625 rem.

este es el css para el contenedor;

 margin-right: 0.825rem; margin-top: 2.425rem; overflow-x: hidden; overflow-y: scroll; max-height: 20.625rem; padding: 0 1.125rem; position: relative; width: 18.75rem;

haga clic en el siguiente enlace para ver la imagen

Ahora tengo un requisito adicional: si la página se amplía al 200% a través del navegador, entonces en esa condición la barra de desplazamiento debería estar visible independientemente de si se alcanzó o no el umbral de altura máxima de 20.625 rem del contenedor. Esto es particularmente para combatir el problema era que si actualmente la página tiene un zoom del 200% a través del navegador Chrome, entonces la ventana emergente modal se está cortando y dado que aún no se ha alcanzado el umbral de altura máxima de 20.625 rem, la barra de desplazamiento tampoco aparecerá (vea la imagen a continuación)

haga clic para ver la imagen

¿Se puede resolver el problema del zoom mediante consultas de medios? Escuché que no necesitamos apuntar explícitamente al zoom del navegador mediante el uso de consultas de medios. Cuando hacemos zoom en nuestro navegador, se comporta como diferentes dispositivos.

Por ejemplo: si hacemos zoom al nivel 175%, el ancho de píxel de nuestro tamaño de pantalla es de 732 px (puede encontrar la relación entre el zoom y el ancho de píxel en mqtest.io [archivado]), que está cerca de los 768 px del ipad mini.

es decir, pantalla @media y (ancho mínimo: 732 px)

Por favor ayuda para resolver este problema ??