teclado - letra india iphone copiar

Problema de tamaño de fuente con iPhone

Question

Actualmente estoy trabajando en una versión móvil de un sitio web, todo está bien, funciona bien en un iPhone, Blackberry y Android.

Tengo un pequeño problema, no es gran cosa, pero aún un poco molesto. Yo tengo:

Etiquetas <h1> establecidas en 18 píxeles y en negrita
Etiquetas <h2> configuradas en 12 píxeles y en negrita
<p> etiquetas configuradas a 12 píxeles y normales

Ahora todo se ve muy bien en el iPhone cuando se ve en vertical, pero cuando el dispositivo se gira hacia el paisaje, los títulos <h1> vuelven más pequeños (difíciles de distinguir pero posiblemente más pequeños que las etiquetas <h2> ?!

Aquí está mi css:

h1 {
 color:#FFFFFF;
 font-size:18px;
 line-height:22px;
 font-weight:bold;
 margin-top:0px;
}

h2 {
 font-size:12px;
 color:#333333;
 font-weight:bold;
 margin-bottom:-5px;
}

p {
 color:#333333;
 font-size:12px;
 line-height:18px;
 font-weight:normal;
}

Answer 1

Como se indica en la respuesta de Neurofluxation, puede usar la regla css -webkit-text-size-adjust, pero tenga en cuenta que esto puede evitar que los usuarios ajusten el tamaño de la fuente en Webkit de escritorio también (consulte este artículo para obtener más información).

A la luz de esto, es probable que valga la pena consultarlo a través de consultas de medios de CSS3 (o agente de usuario) para estar seguro.

P.ej,

@media only screen and (max-device-width: 480px) { 
    html {
        -webkit-text-size-adjust: none; 
    }
}

Answer 2

Creo que estás buscando esto en tu CSS:

html {
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
}

Answer 3

Una mejor solución puede ser usar el 100% en lugar de ninguno, como lo indica el usuario612626 en un hilo más viejo: incoherencias de representación de tamaño de fuente en un iPhone

body {
    -webkit-text-size-adjust: 100%;
}

De esta forma, los navegadores web de escritorio pueden ajustar el tamaño y el zoom proporcionalmente también. Creo que este es un mejor enfoque que el filtrado por tamaño de pantalla.

Espero eso ayude.