Su restablecimiento de CSS necesita un ajuste de tamaño de texto (probablemente) trucos CSS

Killian Walhof:

[…] Mobile Safari aumenta el tamaño de fuente predeterminado cuando cambia un sitio web de vertical a horizontal. Es decir, los teléfonos no lo hacen en el iPad. Safari ha estado haciendo esto durante mucho tiempo como una forma de mejorar la legibilidad de los sitios web no optimizados para dispositivos móviles. […] La cantidad de texto que aumenta arbitrariamente en una situación es exactamente el tipo de cosas de las que desea protegerse al restablecer CSS.

Esto es muy literalmente lo que text-size-adjust derecho. MDN:

Cuando un elemento que contiene texto usa el 100% del ancho de la pantalla, el algoritmo aumenta el tamaño del texto, pero sin cambiar el diseño. text-size-adjust Esta característica permite a los autores web deshabilitar o cambiar este comportamiento, ya que las páginas web diseñadas con pantallas pequeñas en mente no la necesitan.

Puedes ver Documentos propios de Apple mostrar esto es exactamente lo que hacen (en iPhones). Hay insecto antiguo donde esto evitaría escalar, pero probablemente ya no sea una preocupación importante.

Recomendación de Killian:

html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

Firefox ni siquiera lo admite, por lo que podría perder este prefijo de proveedor, pero de lo contrario diría que estoy a bordo. Me gustaría pensar que puedo manejar mi propio tamaño del texto.

me recuerda como Mobile Safari hace esto de escalar ingresando el texto a continuación 16pxasí que ten cuidado con eso también.

Conexión directa →