The foremost tool for writing scalable style sheets is the “em” unit, and it therefore goes on top of the list of guidelines that we will compile throughout this chapter: use ems to make scalable style sheets. Named after the letter “M”, the em unit has a long-standing tradition in typography where it has been used to measure horizontal widths. For example, the long dash often found in American texts (–) is known as “em-dash” since it historically has had the same width as the letter “M”. Its narrower cousin (-), often found in European texts is similarly referred to as “en-dash”.
The meaning of “em” has changed over the years. Not all fonts have the letter “M” in them (for example Chinese), but all fonts have a height. The term has therefore come to mean the height of the font – not the width of the letter “M”.
In CSS, the em unit is a general unit for measuring lenghts, for example page margins and padding around elements. You can use it both horizontally and vertically, and this shocks traditional typographers who always have used em exclusively for horizontal measurements. By extending the em unit to also work vertically, it has become a very powerful unit – so powerful that you seldom have to use other length units.
Bucktown Bell
Cut to the chase.
