css - style - Tamaño de fuente<12px no tiene efecto en Google Chrome
fuentes de texto html5 (13)
Los elementos con tamaño de fuente css <12px no tienen efecto en Google Chrome: el tamaño de fuente es 12px.
¿Que debería 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 en 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>
Resultados de diferentes navegadores:
¿Has intentado poner una cláusula "! Importante" detrás de los estilos de fuente? Esto anularía todo lo demás. Al menos entonces sabría dónde buscar el problema. Me gusta esto:
<p style="font-size:6px !important;">test 6px</p>
¿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?
¿Qué ocurre si convierte la etiqueta <P> en una etiqueta <SPAN>?
¿Es posible que haya definido su etiqueta <p> en algún lugar?
Chrome no te permite establecer el tamaño mínimo de menos de 6 puntos. Y el texto es legible MUCHO más pequeño que eso en las pantallas Retina.
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 hasta la parte inferior y verá el control deslizante "tamaño de fuente mínimo".
De acuerdo con http://www.google.com/support/forum/p/Chrome/thread?tid=389f306a52817110&hl=en Chrome es compatible con 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, ¿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
}
}
Cerrar Chrome, cambiar el tamaño mínimo de fuente y reiniciar Chrome puede ser útil.
Esto funciona para mi.
Intentar:
- use las herramientas del diseñador web para verificar qué CSS afecta su elemento
- publicar html y css también, para que podamos averiguar más
Editar: El último Chrome (estable) lo muestra de esta manera: Renderizado en chrome http://h.kissyour.net/so/less12.png
Lo mismo para 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 de fuente mínimo está establecido en 9px en las preferencias de su navegador.
Con respecto a las tabletas y teléfonos inteligentes y otros dispositivos, es posible utilizar lo siguiente para evitar ajustes automáticos de tamaño de texto usando lo siguiente:
-webkit-text-size-adjust: ninguno;
-moz-text-size-adjust: none,
-webkit-text-size-adjust: ninguno;
-ms-text-size-adjust: ninguno;
font-size-adjust: none;
En realidad, 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.
Me funciona en Chrome 4.0.249.78 (36714), ¿podría estar viendo una copia en caché? .... Intente vaciar el caché de su página (he encontrado que a Chrome le gusta mucho su caché)
deshabilite el ajuste automático siguiendo el estilo.
* {
-webkit-text-size-adjust: none;
}
esto no debería ser correcto, probablemente tenga un elemento sobrescribiendo su atributo dado actual.
Me gusta esto:
body {
font-size:10px;
}
#content {
font-size:12px;
}
puedes usar
body {
font-size:125%;
}
para establecer 0.5em = 10px.
-webkit-text-size-adjust ya no funciona después de Chrome 27.
Trate de usar la transform para reducir el tamaño de la letra con fuerza.
font-size:12px;
transform: scale(0.833);/*10/12=0.833, font-size:10px*/