W3C home > Mailing lists > Public > public-css-testsuite@w3.org > October 2013

Re: line-height: normal and multiple descendant font sizes

From: Gérard Talbot <www-style@gtalbot.org>
Date: Sun, 27 Oct 2013 14:02:08 -0400
To: Alan Gresley <alan@css-class.com>
Cc: Public CSS test suite mailing list <public-css-testsuite@w3.org>
Message-ID: <6c6a255e1aa59df268d0a59eb4789ecc@gtalbot.org>
Le 2013-10-21 22:06, Alan Gresley a écrit :
> On 22/10/2013 7:16 AM, Gérard Talbot wrote:
>> Le 2013-10-21 01:12, Alan Gresley a écrit :
>>> On 20/10/2013 6:52 AM, Gérard Talbot wrote:
>>>> Le 2013-10-19 12:36, Alan Gresley a écrit :

>>>   | The height of a line box is determined by the rules
>>>   | given in the section on line height calculations.
>>> 
>>> §10.8 Line height calculations: the 'line-height' and 
>>> 'vertical-align'
>>> properties http://www.w3.org/TR/CSS21/visudet.html#line-height
>>> 
>>> So for an image (inline replaced element) see part of point 1. of 
>>> §10.8,
>>> 
>>>   | The height of each inline-level box in the line box
>>>   | is calculated. For replaced elements, inline-block
>>>   | elements, and inline-table elements, this is the
>>>   | height of their margin box.
>>> 
>>> and part of point 2 of §10.8.
>>> 
>>>   | The inline-level boxes are aligned vertically
>>>   | according to their 'vertical-align' property. In case
>>>   | they are aligned 'top' or 'bottom', they must be
>>>   | aligned so as to minimize the line box height.
>>> 
>>> 
>>> So for a <length>, if the margin box is zero in height, then the line
>>> box will be the value of the line-height.
>> 
>> Correct. I was not suggesting otherwise.
>> 
>>> A line-height of 0px will
>>> produced a line box of zero height and a line-height of 20px will
>>> produced a line box of 20px height. The below styles for an image 
>>> with
>>> the intrinsic height of 60px will all achieve a margin box of zero
>>> height.
>>> 
>>> img {vertical-align: bottom; margin-bottom: -30px;margin-top: -30px;}
>>> img {vertical-align: top; margin-top: -60px; }
>>> img {vertical-align: top; height: 0px; }
>>> img {vertical-align: bottom; border: 20px solid silver; height: 20px;
>>> margin-bottom: -60px; }
>> 


>> Gérard
>> 
>> P.S.: I now think CSS 2.1 test suite could use additional tests
>> judiciously testing all this.
> 
> Very true but that may involve a rewrite of the sections of CSS2.1 in
> the errata.

Alan,

First draft:

http://www.gtalbot.org/BrowserBugsSection/css21testsuite/line-height-129.html

http://www.gtalbot.org/BrowserBugsSection/css21testsuite/line-height-129.xht

I will be eventually submitting such test (and others to come) into CSS 
2.1 test suite. I have to deal with a strange and mysterious color issue 
affecting Firefox 24 under Linux first.

Gérard
Received on Sunday, 27 October 2013 18:02:41 UTC

This archive was generated by hypermail 2.3.1 : Tuesday, 6 January 2015 21:13:26 UTC