2010-02-19 21 views
29

Elementos con tamaño de fuente css < 12px no tiene efecto en Google Chrome - permanece en tamaño de fuente 12px.Tamaño de fuente <12px no tiene efecto en Google Chrome

¿Qué debo hacer?

Mi navegador Google Chrome usa la configuración predeterminada. Mi versión es 4.0.249.89. Estoy usando Windows XP.

Puede pegar el siguiente código a su Google Chrome para probarlo:

<html> 
<body> 
<p style="font-size:6px;">test 6px</p> 
<p style="font-size:7px;">test 7px</p> 
<p style="font-size:8px;">test 8px</p> 
<p style="font-size:9px;">test 9px</p> 
<p style="font-size:10px;">test 10px</p> 
<p style="font-size:11px;">test 11px</p> 
<p style="font-size:12px;">test 12px</p> 
<p style="font-size:13px;">test 13px</p> 
<p style="font-size:14px;">test 14px</p> 
<p style="font-size:15px;">test 15px</p> 
<p style="font-size:16px;">test 16px</p> 
</body> 
</html> 

Los resultados de otro navegador: https://i178.photobucket.com/albums/w258/neodeep2001/chrome-font-size-diff.jpg

+1

¿Tiene un ejemplo que podamos ver? ¡No hay razón por la que no debería funcionar! – deanWombourne

+0

Acabo de agregar un fragmento de código de muestra. – Billy

+0

Funciona para mí sin ningún problema. – Kitson

Respuesta

27

deshabilita el ajuste automático siguiendo el estilo.

* { 
    -webkit-text-size-adjust: none; 
} 
+0

Creo que esto debería aceptarse como la respuesta. Aunque tenga cuidado con posibles fallas con esta regla CSS: http://www.456bereastreet.com/archive/201011/beware_of_-webkit-text-size-adjustnone/ –

+5

Eso funciona en Safari pero no en Chrome para mí. – GiantSquid

+2

En Chrome 36, no hay tal estilo de css con prefijo ... –

1

esto no debería ser correcta, es probable que tenga un elemento de sobreescritura su actual atributo dado

así:

body { 
    font-size:10px; 
} 

#content { 
    font-size:12px; 
} 
+0

Acabo de agregar un fragmento de código de muestra. – Billy

1

funciona para mí.

Trata de:

  • herramientas de uso webdesigner, para comprobar lo que css afecta a su elemento
  • mensaje HTML y CSS aswell, así que tal vez podemos averiguar más

Editar: reciente Chrome (estable) lo muestra de esta manera: Rendering in chrome http://h.kissyour.net/so/less12.png

+0

He agregado el screencap de 4 navegadores. – Billy

+0

tome la captura de pantalla de css que la afecta: haga clic derecho en uno de 'test text: 6 - 11px' y seleccione" check element "o algo similar (he localizado chrome) - debería ser el último (si sabe qué estoy hablando, deje de leer más) - luego se abre el inspector de documentos y en el lado derecho hay 'estilos 'de panel - captúrelo y publíquelo por favor, tal vez ya veremos. –

0

¿Qué ocurre si haces el < P> etiqueta a < SPAN> etiqueta?

¿es posible que haya definido su etiqueta < p> en algún lugar?

+0

El código de muestra es suficiente para probar. Simplemente pegue el código en su Chrome para echar un vistazo. – Billy

0

Me funciona en Chrome 4.0.249.78 (36714), que podría estar viendo una copia en caché? .... Intenta vaciar la caché de páginas (que he encontrado cromo muy aficionado a su caché)

+0

No es el problema de la memoria caché. Estoy usando Windows XP. ¿El problema solo ocurre en cierto sistema operativo? – Billy

+0

Puedo ver el código html que publicó bien y estoy usando Chrome en Windows XP Pro (una compilación un poco más antigua y la versión beta con soporte para extensiones), el caché es lo único que se me ocurre si están usando el mismo html básico que pegó en su OP. ¿Qué sucede cuando utiliza la opción de menú "inspeccionar elemento", aparece con tamaños de letra más pequeños? ... o ¿parece que se ha anulado de alguna manera? –

+0

¿Qué hay de ver el archivo html en una ventana de incógnito? ... Lo siento, pero todavía estoy atascado en que se trata de una copia en caché del archivo (me llevó años cambiar mi avatar de desbordamiento de pila y mostrarlo en Chrome debido a su caché excesivamente entusiasta) ... aunque se mostraría correctamente en una ventana de incógnito (ya que estaba pasando por alto el caché) –

1

¿Hay una preferencia mínima de tamaño de fuente? ¿Está configurado en 12px? ¿Está habilitado el zoom de página/texto? ¿Tienes algún tipo de complemento de Chrome que modifique el contenido de la página?

+0

Estaba buscando una fuente mínima, también, pero no pude encontrarla. Sin embargo, eso no significa que el pref no esté oculto en algún lugar. – Anonymous

+0

Estoy usando la configuración predeterminada y no tengo ningún complemento. – Billy

+1

@Anonymous Para cambiar el tamaño mínimo de fuente en Chrome, vaya a: configuración> configuración avanzada> contenido web> tamaño de fuente> personalizar fuentes, luego desplácese hacia abajo hasta la parte inferior y verá el control deslizante "tamaño mínimo de fuente". – user1794295

0

¿Ha intentado poner una cláusula "! Important" detrás de los estilos de fuente? Esto anularía todo lo demás. Al menos entonces sabría dónde buscar el problema. De esta manera:

<p style="font-size:6px !important;">test 6px</p> 
+0

Eso no debería ser necesario cuando usa un atributo de estilo en lugar de una regla de estilo. –

5

Según http://www.google.com/support/forum/p/Chrome/thread?tid=389f306a52817110&hl=en Chrome admite un tamaño de fuente mínimo. Si abre "Documents and Settings\User_Name\Local Settings\Application Data\Google\Chrome\User Data\Default\Preferences" en un editor de texto, hacer que se ve algo como lo siguiente ?:

"webkit": { 
     "webprefs": { 
     "default_fixed_font_size": 11, 
     "default_font_size": 12, 
     "fixed_font_family": "Bitstream Vera Sans Mono", 
     "minimum_font_size": 12, 
     "minimum_logical_font_size": 12, 
     "sansserif_font_family": "Times New Roman", 
     "serif_font_family": "Arial", 
     "standard_font_is_serif": false, 
     "text_areas_are_resizable": true 
     } 
    } 

Cierre Chrome, cambiando el tamaño mínimo de la letra, y reiniciar Chrome puede ayudar.

+0

Consulte la respuesta de "Digi3 Colin" con respecto a la corrección CSS: '-webkit-text-size-adjust: none;' http://stackoverflow.com/questions/2295095/font-size-12px-doesnt-have-effect-in- google-chrome/4316700 # 4316700 –

0

Chrome no le permite establecer el tamaño mínimo de menos de 6 puntos. Y el texto es legible MUCHO más pequeño que en las pantallas Retina.

1

Chrome tiene una configuración de tamaño de fuente mínimo. El mío fue establecido en 11px (por defecto), así que tuve que cambiarlo para ver tamaños de letra más pequeños.

Para cambiar el tamaño mínimo de fuente en Chrome, vaya a: configuración> configuración avanzada> contenido web> tamaño de fuente> personalizar fuentes> desplácese hacia abajo y verá el control deslizante "tamaño mínimo de fuente".

1

Lo mismo para un safari. Supongo que esto está configurado en 9px por razones de accesibilidad. El truco está en no confiar en hacer tus fuentes tan pequeñas, para que las explotes en CSS en lugar de reducirlas. Esto es de particular relevancia si creas tu propia fuente usando algo como icnmoon. Por lo tanto, aquí lo mejor es reducir los tamaños de glifos en la fuente, por lo que los está configurando bastante grandes en su CSS y está evitando configurarlos por debajo de 9px si el usuario 'aleja'.

Curiosamente el tamaño de fuente: 0 todavía funciona incluso si el tamaño mínimo de fuente está establecido en 9px en las preferencias de su navegador.

con respecto tabletas y teléfonos inteligentes y otros dispositivos, puede ser posible usar la siguiente para evitar ajustes automáticos de tamaño de texto utilizando la siguiente:

-webkit-texto de tamaño a ajustar: ninguno;

-moz-text-size-adjust: none,

-webkit-text-size-adjust: none;

-ms-text-size-adjust: none;

font-size-adjust: none;

Esto puede afectar la accesibilidad de sus sitios web en estos dispositivos, pero hasta donde yo sé, no hay forma de ajustar el tamaño del texto del navegador tal como está en estos dispositivos. Solo parecen ajustarse automáticamente, dependiendo de la situación que puede ser un misterio. Estos comandos pueden evitar eso, pero creo que la fuente mínima predeterminada que se establece en las preferencias de su navegador puede anular esa configuración de todos modos, al menos en algunos navegadores.

9

-webkit-text-size-adjust ya no funciona después de Chrome 27.

Trate de usar transform a Refuce font-size forcely.

font-size:12px; 
transform: scale(0.833);/*10/12=0.833, font-size:10px*/ 
-2

puede utilizar

body { 
 
font-size:125%; 
 
}

para establecer 0.5em = 10px.

+1

El problema parece ser algo local de la máquina de Billy a juzgar por los comentarios de los otros usuarios. Además, tu respuesta no explica por qué el tamaño de fuente de Chrome solo cambiaba una vez que la fuente se estableció en un valor superior a 12 px según su pregunta. Tal vez intente elaborar su respuesta y asegúrese de probar su código HIS y su código. Si no puede replicar su error, no puede probar su solución sugerida. – Frits

+0

Bienvenido benzford - mi consejo para usted es centrarse en nuevas preguntas no antiguas. Como @Frits dice que realmente necesita descifrar la respuesta, especialmente una que tiene una respuesta altamente aceptada. ¡Perseverar! – micstr

Cuestiones relacionadas