W3C home > Mailing lists > Public > www-style@w3.org > March 1999

Re: Line height, images, vert. alignment, and so on

From: L. David Baron <dbaron@fas.harvard.edu>
Date: Sat, 27 Mar 1999 17:21:33 -0500 (EST)
Message-Id: <199903272221.RAA09808@login3.fas.harvard.edu>
To: emeyer@sr71.lit.cwru.edu, www-style@w3.org
On Sat, 27 Mar 1999 16:24:51 -0500, "Eric A. Meyer"
(emeyer@sr71.lit.cwru.edu) wrote:
> Line-height
> -----------
>    So far as I can tell, the height of a line of text is determined by
> whatever appears on that line.  For example, in CSS2, it says that:
>     "When an element contains text that is rendered in more than one font,
> user agents should determine the 'line-height' value according to the largest
> font size." (CSS2:10.8.1)

That sentence refers to the line-height of a single element that has
multiple fonts.  It cannot even refer to children of that element,
since otherwise either the rules on vertical-alignment or half-leading
would be broken.  (Behavior for aligning children, is, however, well
defined, although not clearly.  The key thing to understand is that the
vertical aspects of the inline box model don't involve containment -
elements routinely overflow their parents.)  The only way a single
element can have multiple font sizes is in something like:


However, since the spec says line height is based on computed values
(which I think is a mistake [1]), this is a moot point.
> Fine, I can accept that.  This implies to me, then, that if an inline image
> (or other replaced element) is part of a line, then the 'line-height' of a
> line needs to be increased to match the tallest element on the line.  In
> re-reading CSS1, I didn't see anything to contradict this position.  On the
> contrary, I found material to support it:

The height of the *line* box is increased, but the height of the
*inline* boxes (other than the image) are not.  The distinction is very
important.  Inline boxes represent inline elements.  A line box
contains inline elements or parts of inline elements.

>    "Replaced elements (e.g. images) on the line can make the line-box bigger,
> if the top of the replaced element... is above the tallest text section, or
> if the bottom is below the lowest." (CSS1:4.4)
>    Is it the case that making the line-box bigger also increases the
> 'line-height'?  Because if so, the test for percentage values on

No.  The value(s) of line-height describe the height of the inline boxes;
the replaced element increases the height of the line box.

> 'vertical-align' in the Test Suite is WAY wrong and need to be errata'ed as
> soon as possible.  If not, why not? What special magic do inline replaced
> elements have that cause them to force open enough vertical space for them to
> appear on a line, but still not increase the 'line-height' in the way the
> different fonts do, as described in CSS2?

The special magic is in the three enumerated rules at the very beginning
of section 10.8.1 (which are the formal definition of how line-height

# 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.
# 3. The line box height is the distance between the uppermost box top
# and the lowermost box bottom.

> 'top' and 'bottom'
> -----------------
>    Most of us are probably familiar with the famous "unsolvable loop" problem
> which arises in conjunction with the use of 'top' and 'bottom' fr
> 'vertical-align'.  It's explained in some detail on p.156 of Lie & Bos, and
> in brief (for those who don't have the book), it goes something like this:

There are worse unsolvable problems than this.  I have a partially
written post on some further problems - I'll try and post it later

> However, all of this appears to hinge on the assumption that any given
> element must be aligned with the top (or bottom) of the highest (or lowest)
> element in the line OTHER THAN ITSELF.  This assumption is explicitly stated
> in Lie & Bos, where it says:
>    "...but 1 is not aligned with the top of the tallest thing (besides
> itself)..." (Lie&Bos:p.156)
>    This leads me to ask: so what?  I can't find anything in CSS which says
> that values of 'vertical-align' force an element to be aligned to everything
> other than itself.  To me, this seems a little weird-- why would an element
> ignore itself in determining what's highest or lowest in a line?  Nothing

I agree with you.  Aligning with itself is fine.  Otherwise this simple
situation is unsolvable.  In reality, it's just not uniquely defined.
I'll get to that in my later post.

> else does, including, so far as I'm aware, the part of the UA which
> calculates the 'line-height' in the first place.


[1] http://lists.w3.org/Archives/Public/www-style/1999Feb/0050.html
     (and responses)

L. David Baron    Freshman, Harvard    dbaron@fas.harvard.edu
Links, SatPix, CSS, etc.  < http://www.fas.harvard.edu/~dbaron/ >
WSP CSS AC                < http://www.webstandards.org/css/ >
Received on Saturday, 27 March 1999 17:21:35 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:26:49 UTC