Em space

Updated: 05/14/2017 by Computer Hope

Metal character blocksAn em space is a term derived from the width of the capital "M" on a metal character block used with early print presses, similar to the blocks shown in the picture on this page.

Today, an em space is used to define the current point size of the font. For example, a 12-point type has an em space of 12 points, which also means each space is 12 points.

Web designers or anyone working with CSS are usually introduced to the em measurement when defining the size of fonts. Em values define your fonts relative size to help them resize relative to the browser's default font size or the website's font size.

For example, in the examples below of different em sizes, the 1em is the same size as the text on this page. Increasing the em to a 2em effectively doubles the size of the font and 0.5 reduces the size of the font in half.


Here is an example of 2em

Here is an example of 1em

Here is an example of 0.5 em

HTML code

The em font-size can be placed in an HTML style tag or within CSS code. Below is an example of specifying an em font-size in an HTML paragraph tag.

<p style="font-size:2em">Here is an example of 2em</p>

Below is an example of CSS applied to all paragraph tags. As seen in the example, the em is not limited to font sizes. It can also be used to define spacing, padding, line-height, and other settings.

p {
font: 1.09em;
line-height: 1.7em;
padding: 0 7em 2em 0;

Em, Em dash, En space, Font size, Measurement, Typography terms