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:14:13 -0800
Message-ID: <CALRQH7_pJgRxD0Zgk60FwmgQUa+BmB8=29xM0OL6i8et_x9BFA@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>
(Please discard my previous message, calculations there were wrong,
below is correct one)


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:
https://dl.dropbox.com/u/14981836/line-height-test-min.htm

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 = 40px height.

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

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 40px.

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.

http://terrainformatica.com
Received on Tuesday, 27 November 2012 04:14:41 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:21:03 GMT