What are ems and why is this the preferred unit for the `word-spacing` property?


#1

Question

What are ems and why is this the preferred unit for the word-spacing property?

Answer

The em unit has a long standing history in the typographic word. Traditionally, ems were used for horizontal measurements but on the web we can use ems for both horizontal and vertical measurements.

One em is a distance equal to the font size. For instance, if an element has a font-size of 16px and word-spacing: 1em; declared on it, the spacing between words will be 16px.

The big advantage of using ems is that distances (like word-spacing) will scale proportionally with font sizes. This proportional scaling allows us to craft typographic designs that are both more accessible and that look great on every screen size.

For a more in depth look at ems, check out the first section of this chapter.