Now that we’ve covered horizontal alignment, let’s move on to vertical alignment. Since the construction of lines is covered in much more detail in Chapter 7, I’ll just stick to a quick overview here.
line-height refers to the distance between the
baselines of lines of text rather than the size of the font, and it
determines the amount by which the height of each
element’s box is increased or decreased. In the
simplest cases, specifying
line-height is a way to
increase (or decrease) the vertical space between lines of text, but
this is a misleadingly simple way of looking at how
leading, which is the
extra space between lines of text above and beyond the
font’s size. In other words, the difference between
the value of
line-height and the size of the font
is the leading.
When applied to a block-level element,
defines the minimum distance between text baselines within that
element. Note that it defines a minimum, not an absolute value, and
baselines of text can wind up being pushed further apart than the
line-height. For replaced elements, ...