block-level elements
Block-level elements are those elements of the source document that are formatted visually as blocks (e.g., paragraphs). They begin on new lines. Several values of the ‘display’ property make an element block-level.
The height of the content area should be based on the font, but this specification does not specify how. A UA may, e.g., use the em-box or the maximum ascender and descender of the font. (The latter would ensure that glyphs with parts above or below the em-box still fall within the content area, but leads to differently sized boxes for different fonts; the former would ensure authors can control background styling relative to the ‘line-height’, but leads to glyphs painting outside their content area.).
CSS3 may include a property to select which measure of the font is used for the content height.
Style all three boxes with:
line-height: 0;Style all three boxes with:
line-height: 50%;