Re: [css21] line-height, problem?

Le Lun 26 novembre 2012 2:21, Andrew Fedoniouk a écrit :
> This sample:
>
> https://dl.dropbox.com/u/14981836/line-height-test.htm
>
> contains two identical paragraphs, the only difference is that
> first one has line-height:normal and second one - line-height:1em;
>
> According to the spec [1]:
>    'line-height' specifies the *minimal* height of line boxes within
> the element.
>
> If that property defines minimal height then these two paragraphs
> should be rendered in the same way.

"
normal
    Tells user agents to set the used value to a "reasonable" value based
on the font of the element. The value has the same meaning as
<number>. We recommend a used value for 'normal' between 1.0 to 1.2.
"
http://www.w3.org/TR/CSS21/visudet.html#leading

This demo page

http://css-class.com/test/css/text/linebox-line-height-011.html

from Alan Gresley shows that 'line-height: normal' is approximately
(average) 1.15em for various fonts. The used value of 'line-height:
normal' depends on the font being used.

> But all browsers I've tried render
> this
> sample with results I cannot interpret. The only exception is IE9, it
> treats
> as if 'line-height' defines max-line-height.


If you can bring out an example/demonstration of this, I may create and
submit a test case for you into CSS 2.1 test suite.


> That is also against the
> spec but at
> least the rendering is predictable somehow.
>
> I suspect that I miss something between lines of the spec.
> My understanding of the spec wording is this:
>
> used-line-height = max( {normal-line-height}, {defined-line-height} );

No.

Try these 2 tests:

http://test.csswg.org/suites/css2.1/nightly-unstable/html4/inline-formatting-context-010c.htm

http://test.csswg.org/suites/css2.1/nightly-unstable/html4/inline-formatting-context-010d.htm

in a browser in which you can delete nodes. Say, you remove the bottommost
small square, then the line box (painted orange in these 2 tests) will
become shorter because the minimal height it needs to be to enclosed all
elements is shorter. The orange painted rectangle must be tall enough to
enclose any of the small squares (which are vertically-aligned) and the
short blue vertical thick line).

You need to install Ahem font
http://www.w3.org/Style/CSS/Test/Fonts/Ahem/
to view those tests.

Gérard
-- 
CSS 2.1 Test suite RC6, March 23rd 2011
http://test.csswg.org/suites/css2.1/20110323/html4/toc.html

Contributions to CSS 2.1 test suite
http://www.gtalbot.org/BrowserBugsSection/css21testsuite/

Web authors' contributions to CSS 2.1 test suite
http://www.gtalbot.org/BrowserBugsSection/css21testsuite/web-authors-contributions-css21-testsuite.html

Received on Monday, 26 November 2012 19:08:58 UTC