Re: Inline h*ll

Also sprach Matthew Brealey:

 > Calculating the height of a block element:
 > 
 > 1.  <q
 > cite="http://www.w3.org/TR/REC-CSS2/visudet.html#q17">
 > If it [the block element] only has inline-level
 > children, the height is from the top of the topmost
 > line box to the bottom of the bottommost line box.
 > 2. <q
 > cite="http://www.w3.org/TR/REC-CSS2/visudet.html#q17">The
 > line box height is the distance between the uppermost
 > box top and the lowermost box bottom.
 > 3. Inline elements: <q
 > cite="http://www.w3.org/TR/REC-CSS2/visudet.html#q17">The
 > 'height' property doesn't apply, but the height of the
 > box is given by the 'line-height' property.</q>
 > 
 > Given <p style="font: 12pt/14pt">
 > Some text<br>
 > <span style="font-size: 300%">Some big text</span><br>
 > Some more text
 > </p>
 > 
 > Using 1:
 > a) P has 3 line boxes.
 > 2:
 > (b) the height of these line boxes is from the top of
 > the uppermost box top to the lowermost box bottom
 > 3:
 > (c) the height of the box is given by line-height.
 > 
 > Therefore, the P element is 42pt high 

What's missing from your calculations is the effects of step 2 in the
line height calcualtions described in CSS2, section 10.8:

 1 The height of each inline box in the line box is calculated (see
   "Computing heights and margins" and the 'line-height' property).

 2 The inline boxes are aligned vertically according to their
   'vertical-align' property.

 2 The line box height is the distance between the uppermost
   box top and the lowermost box bottom.

It's true that all inline boxes are 14pt tall, but since they are
aligned vertically on their respective baselines -- which are in
different positions -- the resulting line box is taller than 14pt.

The baselines are in different positions due to negative
"half-leading" eating in equally from the top and bottom, while the
baseline is bypically below the middle.

Who can draw the figure which explains this in a "aha!" manner?

Regards,

-h&kon

Chief Technology Officer                                Opera Software
Håkon Wium Lie                     http://www.opera.com/people/howcome
howcome@opera.com                                gets you there faster

Received on Monday, 17 January 2000 07:15:58 UTC