> Faqs > ¿Debo usar REM con el tamaño de fuente fijo establecido en la raíz (etiqueta HTML)?

¿Debo usar REM con el tamaño de fuente fijo establecido en la raíz (etiqueta HTML)?

¡Hola! Tengo dos preguntas, si alguien pudiera ayudarme.

Uno, si configuro el tamaño de fuente en la etiqueta HTML, ejemplo "html {font-size: 12px;}", y lo uso en el resto de las unidades css REM en todos los tamaños de fuente, el navegador ajustará mi zoom en función de 12px? ¿O usará la fuente predeterminada del navegador (probablemente 16px) cuando use el zoom?

Dos, ¿es correcto mezclar diferentes dimensiones relativas (REM, EM,%, VH, VW) en un proyecto? ¿O es mejor usar solo uno (por ejemplo, REM) incluso para dimensionar elementos como un tamaño div?

Gracias.

Respuestas

Es perfectamente correcto mezclar las unidades de CSS en un proyecto. Preferiblemente las que son relativas %, VW, VH, REM, EM... aunque también puedes usar absolutas (px, pt...) si lo necesitas.

Es necesario conocer cada unidad porque unas veces te viene bien usar una y otras veces otra unidad.

Sobre la recomendación de definir el tamaño de fuente de manera global en el documento, a través de los estilos en la etiqueta <html>, es colocar el valor de 100%.

html {
    font-size: 100%;
}

Esto setea tu fuente de manera global a lo predeterminado en los navegadores, que generalmente es 16pt. Sin embargo, dependiendo del usuario esa configuración de base puede variar, porque depende de la configuración del equipo del usuario o del navegador. Por accesibilidad es importante respetar esta configuración.

Luego, como señalas, tendrías que colocar los tamaños de las fuentes todas relativas, para que se adapten a esta configuración de accesibilidad. Pero inclusive los tamaños de los márgenes y los espaciados también deberían ser relativos, asignados con unidades del estilo REM o EM, así los espaciados también dependerán de la configuración establecida por el usuario, lo que redundará en una mejor usabilidad de tu página.

Santiago
571 18 45 21