Sobre la medida em

[tunait]

Buenas,

he leído por ahí en más de una ocasión (no sé exactamente dónde) que si se usa la medida em para los font-size que es proporcional, o algo así. Osea, que si se ve en una resolución mayor, el size también es mayor manteniendo el mismo valor.

¿Alguien me confirma si esto es cierto?

En caso de ser cierto... ¿por qué a mi no me funciona?

Gracias


saludos

[furoya]

Hola tunait :

me parece que la medida que se ajusta a la resolusión es px ; em (ancho) y ex (alto); solo se ajustan al BASE FONT (¿o al "base parent "?).

Tu usas IE 5 ¿verdad?. Te dejo un par de enlaces

http://msdn.microsoft.com/library/de...s/fontsize.asp

http://www.bigbaer.com/css_tutorials/css_font_size.htm

saludos
furoya

[PatomaS]

Hola

Bueno, revisando la recomendación de las css, vemos aquí:

http://www.w3.org/TR/CSS2/syndata.html#length-units

que tiene un comportamiento curiosos o especial justo cuando se utiliza en el font-size.

Si revisamos el párrafo relativo a los tamaños de fuente aquí:

http://www.w3.org/TR/CSS2/fonts.html#propdef-font-size

vemos que los hijos heredan los valores de los padres, así que elprimer elemento para el que definamos el tamaño ed letra, se convertirá en el padre, al menos en lo que se refiere a esa propiedad.

Pero si lo ponemos más claro.

Supongamos este ejemplo:

definimos un etilo para el body, usando la unidad 'em' y luego creamos un estilo con la misma definición.

Luego dos párrafos, uno sin estilos de ningún tipo y otro al que le aplicamos el segundo estilo que habismoa creado.

Al cargar la página, se verán igual, pero si en explorer aumentamos o reducimos el tamaño de visualización de la letra (ver > tamaño del texto > alguna opción), veremos que el segundo párrafo es más grande que el primero (o más pequeño si reducimos la visualización).

Esta diferencia se debe a varias cosas.

Primero, a que la unidad 'em', requiere la definición de un tipo de letra debido a que no tiene el mismo tamaño la dimensión de '1 em' de una Verdana que el de una Futura compacta.

Segundo, a que pese a que la herencia de los valores suele ser de los valores calculados por el navegador, los elementos hijo heredan los valores no modificados del padre.

Tercero, el manejo que hace el explorer para aumentar o reducir el texto, se basa en el uso de los valores relativos de la propiedad font-size smaller y larger. Aunque sus límites son los viejos valores que van del 1 al 7.

Cuarto, el valor 'em' siempre 'pregunta' al padre que tamaño tiene para definirse a si mismo, por lo tanto, hayque ser cuidadoso con las definiciones que lo utilizan. Es el problema de los valores relativos. Esto va unido con lo primero.


Así que concluyendo, podemos decir que es una unidad de medida un poco extraña y poco amigable de utilizar. Depende de muchos factores para que se representa como queremos y parte de esos factores son incontrolables por el autor de las páginas debido a que son parte de los navegadores.

Además, este tema ha generado muchas líneas en foros, tanto de css, como de navegadores específicos.

Por cierto, el ejemplito que mencionaba, es esto:

para los estilos:

body {
font-size: 1em;
}
.tamanoem {
font-size: 1em;
}

y para el código html, algo así:

<p>este es el primer texto del documento, no tiene modificadores de ningún tipo</p>
<p class="tamanoem">este es el primer texto del documento, este texto tiene el tamaño 1 em asignado por una clase</p>

la primera parte del párrafo está repetida para que sea más fácil hacer la comparación.

Espero haberme explicado adecuadamente.

Felicidad

[furoya]

Hola todos:

regreso para efectuar algunas correcciones a mi mensaje anterior. Quizá por mi apuro en responder, o tal vez por mi ya inocultable estado de senilidad, he tipeado un par de errores muy gruesos que, si bien están aclarados en los enlaces que sugerí y -además- en el extenso y pormenorizado mensaje de PatomaS, éstos no me inhiben para realizar una "FE DE BURRATAS" propia.

Donde dice "ancho" debería decir "alto", ya que la diferencia está en que em toma la altura del caracter '█' , mientras que ex o hace del caracter 'x'. Ésta era una vieja confusión que yo tenía, y que parece no resolví bien en mi memoria.

Donde dice "base parent" ... no sé lo que quise poner, seguramente "base parent font" o "parent font", que tampoco existen, pero serían una alusión a la dependencia de em al elemento parent cuando no fuese BODY.

Aprovecho para recordar un código posteado hace mucho, del cual no me siento particularmente orgulloso, pero puede serle útil a quien esté trabajando en el tema de las medidas relativas.

Yo sé que existe...script ajusta resolucion


Saludos

furoya

[tunait]

Ufa cuánta info qué bien!

Leeré todo con calma y les digo

muchas gracias por las respuestas, furoya y PatomaS

[GG]

Efectivamente em, se refiere a una proporción en relación a la letra más ancha del alfabeto: la M. Es en relación a esta proporción que se ajustan los tamaños de las letras.

[fero_disain]

Si pero....
La medida proporcional a una M pero de que tamaño????
Lo siento pero no he terminado de entenderlo.

Entonces que ventajas tiene la utlizacion de "em"??????,
por lo que he visto tiene ventajas en la accesibilidad
de la pagina( cuando un usuario amplia el contenido
y tal), pero no lo tengo claro.


gracias chicos
fe

[seoista]

fero_disain, ¿te has dado cuenta que eso mensajes son de hace 5 AÑOS?.

Saludos.

[Mikmoro]

Aun así (5 años), no viene mal aclararlo para más de uno: si tu estableces el tamaño de la fuente en "em", se vera del tamaño que yo tenga predeterminado en mi navegador, de manera que si por alguna razón tengo predeterminado el tamaño como 20px, la veré de ese tamaño, igual que si la tengo de 8px así la veré, algo que no ocurriría en caso de que tú marcaras el tamaño como 12px, ya que en ese caso el navegador ignoraría mi elección para atender a tu diseño de 12px (con alguna salvedad).

Evidentemente el "em" en mucho más accesible, permitiendo que yo decida el tamaño en función de mis necesidades, por encima de tu gusto o diseño.

[furoya]

Un detalle medio offtopic.
Por lo general trato de que estas cosas no pasen —al menos en los post donde participo, en otros no me meto— para evitar no sólo el cierre del tema sino también las confusiones.

Me refiero al hecho de que se explique, y hasta se corrija, el mensaje que aclara una duda; para que al final caiga alguien a poner cualquier cosa porque —sabemos— en este Foro 'responde' también el que no sabe.

El grave inconveniente de estos casos es que mucha gente no lee todo el tema como corresponde, sino que se queda con la última respuesta como si tuviera siempre que ser la más válida. Y no es así.

Resulta que en muchos de los temas en que participo, después de un debate en que se llega a alguna conclusión práctica, útil o por lo menos interesante, suele caerse un desubicado a poner cualquier güevada con pretenciones de "gran respuesta" o "solución definitiva". Y a veces es claramente una falta de respeto, porque no solamente ignora a quienes lo precedieron respondiendo lo mismo, o casi, porque lo pone incompleto, o mal, porque no lo entiende; sino que claramente 'ningunea' al resto de los participantes del tema, como si sus comentarios estuviesen equivocados y los propios —que generalmente sí son mentira o no funcionan—, fueran una solución.

Ya estoy posteando poco en este sitio, por eso supongo que si pasa mucho en los temas donde estuve, a quienes publican más les debe pasar todavía mucho más.
La solución (es una manera de decir) para esto sería tomarse el trabajo de agregar siempre un mensaje al final aclarando que la respuesta anterior es una burrada e invitando a su autor a no repetirla en otros casos. Si él (o ella) no lo entienden, al menos servirá de ejemplo a otros que vean el tema para que no hagan lo mismo más tarde.

En el caso de GG no me pareció relevante, porque con las explicaciones y los enlaces era más que evidente. Pero fero_disain me desengañó. Aún 5 años después, había que hacerlo.

Te agradezco la aclaración, Mikmoro. Está dicho que era indispensable, más teniendo en cuenta que por aquí pasaron tunait y PatomaS, lo que va a hacer que más de uno se detenga a leer porque suelen ser una garantía. Lo único que lamento es que hoy mi mensaje va a ser el último . Pero, bueno, quien se mande derecho al final seguro va a tener curiosidad y va a mirar los anteriores.

No acostumbro dejar sermones gratuitamente, pero entre éste y otros temas ya se habló todo, así que no voy a agregar nada nuevo.
Puedo dejar, eso sí, otros links donde estuvimos comentando sobre "em" en los últimos 5 años.

la propiedad .1em

2 Fuentes fijas mediante CSS

Ayuda: Div height:0 y innerHTML #46

Bloqueo tamaño-texto

Sobre px y em

P.D. : Por favor, el próximo que escriba un mensaje ... ¡qué no ponga una güevada!