width = device-width no funciona en Mobile IE

Question

Estoy intentando hacer un sitio web que funcione bien en teléfonos móviles. Hasta ahora, todos los teléfonos que he probado funcionan bien, pero los teléfonos con Windows Mobile IE. Parece que Mobile IE solo lee el <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes"/> y no establece el ancho del ancho del dispositivo.

¿Alguien tiene alguna experiencia con esto o alguna sugerencia para hacer que el sitio se vea mejor en Mobile IE?

¡Gracias por la ayuda!

Answer 1

Mobile IE parece respetar solo la metaetiqueta de la ventana gráfica si especifica un ancho real. Para obtener el ancho de página para seguir la anchura del dispositivo real, utilizar una etiqueta meta mobileoptimized con contenido ajustado a 0:

<meta name="mobileoptimized" content="0" />

detalles en MSDN: http://msdn.microsoft.com/en-us/library/dd938878.aspx

Si se combina esto con la etiqueta meta de visualización como se indica arriba, esto debería brindarle lo que está buscando en la mayoría de los navegadores móviles.

Answer 2

Para las versiones de IE Mobile anteriores a Windows Phone 7, la ventana gráfica no se reconoce; debe usar la etiqueta optimizada para dispositivos móviles como se muestra arriba.

Answer 3

en CSS escribir este

@-ms-viewport{ 
    width: device-width; 
} 

o en html:

<style type="text/css"> 
    @-ms-viewport{ 
    width: device-width; 
    } 
</style> 

dispositivo y después de la anchura de trabajo