Re: Line layout in browsers

On Friday 18 January 2008 02:18, Alex Mogilevsky wrote:
> On Thursday 17 January 2008 21:28, Eric A. Meyer wrote:

> >     * Also, the borders of the 'span' don't seem to change their
> > separation from the characters no matter what 'line-height' value I
> > explicitly assign it.  I'd think they should move up and down.
>
> Borders are also drawn around actual text, and they should not depend
> on line-height. E.g. if line-height is set to a big number (or a span
> has a smaller font) the border will not grow when line-height grows.

With respect to the height of inline boxes, we (the CSS WG) observed 
different behaviors in different browsers and didn't reach consensus on 
which behavior was correct. So we'll let the author choose. But that 
cannot be done without an extra property and we didn't want to add new 
properties to CSS level 2.

So the CSS2.1 spec[1] says that the height of an inline box depends on 
the font size but the exact relation is undefined (but will be defined 
with a new property in level 3). It does give two suggestions, though:

a) The font size. This is my favorite, because it is predictable. If you 
have 12px of font size, 1px of borders and 16px of line height, the 
borders will be 2px apart.

b) The sum of the font's maximum ascender and descender. This ensures 
that no ascender surpasses the border. (But in some fonts, such as 
Zapfino, the location of the borders may surprise you...)

[1] 
http://www.w3.org/TR/2007/CR-CSS21-20070719/visudet.html#inline-non-replaced



Bert
-- 
  Bert Bos                                ( W 3 C ) http://www.w3.org/
  http://www.w3.org/people/bos                               W3C/ERCIM
  bert@w3.org                             2004 Rt des Lucioles / BP 93
  +33 (0)4 92 38 76 92            06902 Sophia Antipolis Cedex, France

Received on Friday, 18 January 2008 16:44:21 UTC