How Is Unitless CSS "line-height" Computed?

A unitless line-height value in CSS is always calculated relative to the font-size of the element to which it is applied. It is computed by multiplying the line-height value by the element's font-size (i.e. line-height * font-size).

For example:

p {
  font-size: 16px;
  line-height: 1.5; /* 1.5 * 16px = 24px */
}

In this example, the computed line-height value is 24px because that's what you get by multiplying the element's font-size of 16px with the line-height of 1.5.

When a font-size is specified with any valid CSS unit, the unitless line-height will be computed relative to that font-size, and it will adopt the same unit of measure. For instance, when the font-size is specified using "em", the unitless line-height will be computed relative to the font-size in "em" and will also be expressed in "em":

p {
  font-size: 2em;
  line-height: 1.5; /* 1.5 * 2em = 3em */
}

This will make the spacing between lines 3 times the size of the font.

In general, when the line-height is set to a unitless value, it is interpreted as a multiple of the element's font-size. This means that the spacing between lines of text will be proportional to the font size, rather than being of a fixed size.