html - spec - Safari 9(en iOS9) ignora la configuración de CSS
html5 whatwg (2)
Estoy trabajando en esta página web: http://dev.mailagent.biz/cms/NEWS
Es un HTML sensible que funciona bien en todos los navegadores, todos los tamaños de ventanas. Solía funcionar bien en iPhones también, hasta que iOS9 llegó a ser. Ahora todo el sitio está roto. Se han agregado márgenes adicionales (supongo), lo que significa que todos los cuadros parecen tener un montón de espacio en blanco. A continuación se muestra una captura de pantalla de mi iPad.
Configuré la ventana gráfica como
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
Intenté establecer los márgenes a 0 e incluso a valores negativos, pero los cuadros no se mueven. También traté de eliminar cualquier espacio en blanco entre etiquetas div, sin cambios.
Estoy usando un css receptivo para todos los navegadores: dev.mailagent.biz/cms/css/main_responsive.css A continuación, adjuntando este específicamente para iOS9: http://dev.mailagent.biz/cms/css/iOS9.css
Sin embargo, la mayoría de los estilos aún se ignoran, especialmente para hacer con los márgenes. Por ejemplo, la hoja de estilo iOS9 debería alinear todo el sitio a la izquierda (.centeredWrapper tiene margen: 0 no margen: automático). Sé que el iOS9.css está conectado para iPhones / iPads, como por ejemplo, algunos márgenes y colores se cambiaron con éxito en el menú en la parte superior en comparación con la versión de escritorio.
¿Alguien tiene alguna idea de lo que está pasando? ¿Cómo le digo a Safari que deje de tratar de ser inteligente? ¿O cómo debería cambiar mi marcado?
La línea 281 (o 98) en main_responsive parece ser la culpable:
.content ul, .content ol, :not(.content ul.slideshowUl) { margin: 0 0 10px 30px;}
Comenté eso en el inspector de Safari y toda la página volvió a la normalidad.
Intente agregar un ajuste para ajustar a la etiqueta de su ventana gráfica
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">