Relative Size

Another approach (and the one often suggested) is to use relative-size measurements for font size instead of absolute sizes. These set the font size of an element as a ratio to the parent’s font size.

There are a few ways to accomplish this, but we will focus on two:

  • percent (%)
  • ems (em)

Both are relatively similar in how they work. A value of 100% or 1em will both leave the font size the same as the parent element. Likewise a value of 50% or 0.5em will reduce the font size by half.

NOTE: An em is described as being the width of the letter ‘m’. So 1em is the width of an ‘m’ in the specified font.