Configuración del ancho de la ventana de visualización cuando el contenedor es más pequeño que el ancho del dispositivo
Tengo una pequeña webview (con aproximadamente 75px de altura) que muestra el contenido html con los siguientes metadatos en la cabeza:
<meta name="viewport" content="width=device-width, initial-scale=1" />
Este html se mostrará en las vistas web de Android Phone, Android Tablet, iPhone y iPad.
- Establecimiento de una vista adecuada, compatible con ios & android, que funciona con la rotación
- es el tamaño de la ventana de visualización móvil más grande que el tamaño de la pantalla?
- Problema con meta viewport y Android
- Libgdx | ¿Cómo crear minimap?
- Problema de escalado de página en dispositivos Android
En los dispositivos de teléfono (Android Phone / iPhone), el ancho del contenedor de visualización web es el mismo que el ancho del dispositivo, por lo que la etiqueta de meta datos de la ventana de visualización anterior parece funcionar correctamente.
Pero en los dispositivos de tableta (Android Tablet / iPad), el ancho del contenedor de vista web será dinámico, por lo que a veces el ancho del contenedor de vista web será menor que el ancho del dispositivo.
Esto significa que en la tableta, siempre que el ancho del contenedor de vista web sea menor que el ancho del dispositivo, el contenido html debe recortarse.
Sin embargo, después de alterar los metadatos para tener
<meta name="viewport" content="width=50, initial-scale=1" />
o
<meta name="viewport" content="width=500, initial-scale=1" />
Descubrí que los metadatos parecen ser ignorados en Android y iPhones / iPads con iOS9. Esto significa que el contenido se ajustará y aparecerá como se espera en todos estos dispositivos. Sólo puedo ver este problema en iPads pre iOS9.
He intentado eliminar la etiqueta de metadatos de la ventana de visualización y también he intentado usar la siguiente etiqueta de metadatos
<meta name="viewport" content="width=100%, initial-scale=1" />
y ambos funcionan bien, pero me preguntaba si había alguna solución más limpia, ya que me han recomendado no alterar o eliminar los metadatos de viewport que estoy utilizando actualmente.
- El navegador de Android se bloquea en las llamadas de Ajax, cuando se define la metaetiqueta de la ventana de visualización
- Altura: 100% en <body> no funciona en la aplicación web android?
- Escalado de la vista de Android 4.1 (setInitialScale, meta-escala inicial no funciona)
- Configuración del visor para escalar para ajustar tanto el ancho como la altura
- Hacer que la vista web de una tableta simule un pequeño dispositivo
- La especificación de visor Pinch / Zoom funciona en el iPhone pero no en Android
- WebView en Android 4.4 y escala inicial
- La metaetiqueta del visor no funciona