RE: Line layout in browsers

Right, that's what David doesn't like about definition of "line-height:1", and I agree.

"normal" line height is what font designer decided would be the perfect distance between two lines; when represented in EMs it is nearly always bigger than one.

In this test, forcing line height to 1EM (against typographer's will) forces more overlap that would happen there if line height were not specified.

-----Original Message-----
From: www-style-request@w3.org [mailto:www-style-request@w3.org] On Behalf Of Eric A. Meyer
Sent: Monday, January 21, 2008 1:25 PM
To: www-style@w3.org
Subject: Re: Line layout in browsers


At 2:38 PM -0600 1/21/08, David Hyatt wrote:

>Borders increase the span height (as does padding).  If you put 1px
>top and bottom borders on a span in an attempt to "see where it is",
>then you just made a span box that is 2px taller.  Therefore at a
>line-height of 1 (100px), there will be a slight overlap since the
>span boxes are a bit taller than the height of the line (102px).

    Agreed.  In the case we were discussing, though-- the first test
on
<http://meyerweb.com/eric/css/tests/line-height/bigtext-spans.html>--
there is no padding on the spans, and at 'line-height: 1' there's a
more than a few pixels of overlap in Safari and IE.

--
Eric A. Meyer (eric@meyerweb.com)     http://meyerweb.com/

Received on Monday, 21 January 2008 21:43:24 UTC