calc and viewport units for line-height

The ideal measure, according to Bringhurst, is between 20em and 40em. Of course many factors may influence this number. For instance, line-height: the higher the line-height, the wider a measure can be. Which makes sense. When there's more space between each line of text, it's much easier to find the next line than when all lines are cramped together. This could result in the idea that we should use the vw unit to define line-height: the wider the viewport, the higher the line-height should be. This example uses a calc function which mixes an em value and a vw value: line-height: calc(1.414em + 1.414vw). This is similar to min-line-height, which doesn’t exist.

Indeed. This doesn't work in Firefox. They should really fix this bug.

View this page in Ish

  1. vw for line-height
  2. vmax for line-height