Diferente tamaño de fuente en web HTML en iOS y en Android

alvarols · #1 (**permalink**) 04/09/2013, 09:18

Estoy haciendo una página responsiva de tal forma que se vea en los dispositivos. Pero sucede que el tamaño del texto no se ve igual en Android que en iOS. ¿Cómo puedo arreglar eso?

Muestro dos pantallazos:

Así se ve en Android:

Así se ve en iOS y así se debería de ver en Android también

HTML

Código HTML:

Ver original<div class="contenidos times">
        <h1>Contenidos</h1>
    </div>

CSS

El fondo (las florecitas que acompañan al título) es responsivo y está adaptado para que al modificarse el tamaño de la pantalla tome como referencia el punto medio de la imagen y no la izquierda o derecha.

Código CSS:

Ver original.contenidos{
    width:80%;
    max-width:978px;
    height:30px;
    margin:0 auto;
    background-image:url(images/contenidos.png);
    background-repeat: no-repeat;
    background-position:bottom;
    background-attachment:local;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

La clase times es solo para poner lafuente

Código CSS:

Ver original.times{
    font-family:"Times New Roman", Times, serif;
}

lilmaster · #2 (**permalink**) 04/09/2013, 10:48

Asegurate de tener esto dentro del head

Código HTML:

<head>
   
    <meta name="viewport" content="width=device-width, user-scalable=false;">
    <!--Me ayuda para que el sitio tome las medicas de un dispositivo-->  
 
</head>