Re: line-height suggestions and easier alignment

On Jan 11, 2012, at 4:03 PM, Alan Gresley wrote:

>> By default, Firefox computes 'normal' as '1.2' while other browsers use '1.0'
>> 
>> Revealing experiments on content box height, vertical-align and
>> line-height (Ahem font required for examining that page)
>> 
>> http://www.gtalbot.org/BrowserBugsSection/css21testsuite/experiments-va-lineheight-02.html
>> 
>> 
>>   For IE8, line-height: normal is equivalent to line-height: 1.0
>>   For Firefox 3.6.6, line-height: normal is equivalent to 120px / 100px =
>> 1.2 and not 1.0
>>   For Opera 10.60, line-height: normal is equivalent to line-height: 1.0
>>   For Safari 5.0, line-height: normal is equivalent to line-height: 1.0
>> 
>> Gérard (who is very busy today)
> 
> That's OK Gérard. I haven't even begun testing 'line-height' values using keywords but I do note that with test using Ahem font, the default 'line-height' is equivalent in each browser as if line-height: normal has been used (Firefox being the exception with 1.2).

The used value of the 'normal' keyword varies per font and is based on the intrinsic metrics build into the font. Font-size may affect the used value as well (rounding 'errors' coming into play at some lower values). It is rarely 1.0 though.

Common roman fonts installed on OS X 10.6 / 10.7 have a used value of 1.0 ~1.3 @100px and the value doesn't differ accross browsers. CJK fonts have typically a larger value (1.5 ~ 1.9). IIRC,  the values for the same fonts on Win 7 is more or less equal to OS X.

Arial: 1.150
Calibri: 1.220
Futura: 1.32
Georgia: 1.14
Helvetica: 1.00
Helvetica Neue: 1.203
Times: 1.200
Times New Roman: 1.151

A page that attempts to fetch those values (requires Flash):
http://brunildo.org/test/aspect-lh-table2.html

Ahem should have a used value of 1.0, or so I thought. Gecko appears off ?



Philippe
--
Philippe Wittenbergh
http://l-c-n.com/

Received on Wednesday, 11 January 2012 17:40:50 UTC