Añadir caracteres especiales usando la propiedad CSS content

La propiedad content nos permite añadir contenido adicional a través de CSS (mucho mejor explicado en MDN). Lo podemos utilizar para añadir prefijos o sufijos. Por ejemplo para incluir comillas en una cita o añadir el socorrido «Nuevo» en entradas de menú, secciones, etc.

Yo lo quería usar para indicar que un enlace llevaba a una página fuera del dominio. De hecho, quería usar este símbolo: ↗, para indicarlo.

Para añadir caracteres no latinos, podemos usar su valor Unicode. Así, el Unicode para ↗ es 2197 (\2197).

Para conseguir lo que pretendía, el CSS quedaría así:

a[target="_blank"]::after
{
	content: "\2197"; 
}

Convertir pixels (px) a em

A la hora de hacer una web elástica, uno de los problema con los que nos encontramos es la falta de exactitud de las medidas con las que trabajamos.
Un pixel, es 1 pixel en pantalla, pero ¿cuánto es 1em o 1ex?

(Casi) Fácil. Aquí va una pequeña tabla de equivalencia sacada de (Worldtechies)

PointsPixelsEmsPercent
6pt8px0.5em50%
7pt9px0.55em55%
7.5pt10px0.625em62.5%
8pt11px0.7em70%
9pt12px0.75em75%
10pt13px0.8em80%
10.5pt14px0.875em87.5%
11pt15px0.95em95%
12pt16px1em100%
13pt17px1.05em105%
13.5pt18px1.125em112.5%
14pt19px1.2em120%
14.5pt20px1.25em125%
15pt21px1.3em130%
16pt22px1.4em140%
17pt23px1.45em145%
18pt24px1.5em150%
20pt26px1.6em160%
22pt29px1.8em180%
24pt32px2em200%

Jon Tan lo explica mejor, indicando la fórmula para calcular la equivalencia:

1 ÷ parent font size (px) × required pixels = em equivalent

Asumiendo que, por defecto, el tamaño por defecto de la fuente en los navegadores es de 16px.

Para cálculos más complejos, podéis usar Em calculator.