On Apr 9, 2007, at 10:33 AM, Chris Hoffman wrote:
> I've been playing with overlapping text and line-height is causing me
> some confusion. There's no live page, but the code is super-simple, so
> I'll post it here:
>
> HTML:
>
> <p><span>Lorem ipsum consectur veni vidi . . .</span></p>
>
> CSS:
>
> p span {
> background-color: #ccc; /* make the lines visible */
> }
>
> p {
> font-size: 12px;
> line-height: 14px;
> }
>
> As I understand it, the text box (inline box?) -- to which the
> background-color applies -- should be 12 pixels high. The difference
> between that and the line-height (14 - 12 = 2 pixels) should then be
> divided in half, and half added to the top of the inline box and half
> to the bottom. Then the lines should be stacked in the paragraph.
>
> But with FF 2, my paragraph is a solid block of gray, and there's no
> 2-pixel gap between lines where I'm expecting one. Qu'est-ce que le
> fudge?
No, the computed height of the inline element (the amount of
background-colour that will be applied) depends on/includes the line-
height.
That is somehow mentioned here:
<http://www.w3.org/TR/CSS21/visudet.html#inline-non-replaced>
Philippe
---
Philippe Wittenbergh
<http://emps.l-c-n.com>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
