W3C home > Mailing lists > Public > www-style@w3.org > November 2012

Re: [css21] line-height, problem?

From: Andrew Fedoniouk <news@terrainformatica.com>
Date: Mon, 26 Nov 2012 20:10:16 -0800
Message-ID: <CALRQH7_yBvrUOgoeMQH4RddWrA5+7Cxfbq6yhn+3F413Ks9ZQQ@mail.gmail.com>
To: "Tab Atkins Jr." <jackalmage@gmail.com>
Cc: Stephen Zilles <szilles@adobe.com>, "www-style@gtalbot.org" <www-style@gtalbot.org>, "www-style@w3.org" <www-style@w3.org>
On Mon, Nov 26, 2012 at 5:00 PM, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
> On Mon, Nov 26, 2012 at 4:35 PM, Andrew Fedoniouk
> <news@terrainformatica.com> wrote:
>> Consider these two properties:
>> 'min-height' specifies the minimal height [of an element].
>> 'line-height' specifies the minimal height of line boxes.
>> Seems like both define same concept - they constrain the height to a
>> certain minimal value that
>> computed value of height may use.
>> By defining min-height you *cannot* make elements smaller, only larger.
>> But by defining line-height you can make line-box smaller than its content.
> I'm confused.  You just stated completely different things.
> The line box never grows smaller than the largest line-height of the
> box fragments on the line.  That's the same sense of "minimal" that
> min-height gives to a box.

I don't understand "never grows smaller than ..." statement, something
inside me cries about such language construct.

Anyway, check this:

In that sample we have two lines:

First line
Next line

Let's assume that normal size of line boxes there
(determined by size of glyphs in used font) will be:
(A = 16px) + (D = 4px) + ) -> 20px;

So two lines will take 20px * 2 = 20px height.

What exactly happens when you apply line-height:10px ?
What would be the used value for the line-height in that

If line-height defines minimal line height then it will be
Y = max ( declared-line-height, content-line-height )
this leads us to
    max ( 10px, 20px ) = 20px;

And so total height of the element will still be 20px.

If line-height defines just line-height (but not its minimal constraint
as stated in spec) then height of the element will
be 10px + 10px = 20px;
That is what I see in all UAs. Try your favorite browser :) with that
link above.

So is the question: who's wrong here?

Andrew Fedoniouk.

Received on Tuesday, 27 November 2012 04:10:45 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:23 UTC