803539 - Different treatment of first-letter float in Firefox vs Chrome, Opera, IE

Status: RESOLVED DUPLICATE of bug 290125

(Core :: Layout, defect)

Description

[Joe Drew (not getting mail)]

Go to the referenced URL. In Firefox, with and without line-height specified, the "C" in "Call" lays out in the same spot, and there are only 4 lines floating to the right of it. In Chrome, IE, and Opera, 5 lines are floating to the right of it, and if you remove the line-height and margin-bottom attributes, significantly more (6-8 iirc).

Which is correct? Should we change?

Comment 1

[Boris Zbarsky [:bzbarsky]]

The spec (http://www.w3.org/TR/CSS21/selector.html#first-letter ) says:

  To allow UAs to render a typographically correct drop cap or initial cap, the UA may
  choose a line-height, width and height based on the shape of the letter, unlike for
  normal elements.

which we do and other UAs do not as far as I can tell.

And in particular, see what happens when you use a "Q" as the first letter (ignoring the weird horizontal behavior): we switch to 5 lines to give it enough vertical space, while Chrome, say, stays the same no matter what letter you use.  

And for the reason we do that, try removing the line-height and margin styles and using a 't' as first letter and seeing how it renders....

Comment 2

[Joe Drew (not getting mail)]

I am definitely happy with the Firefox behaviour, fwiw. Just wondering why it's different :) Feel free to close this as invalid.

Comment 3

[Boris Zbarsky [:bzbarsky]]

Yeah, I think it's mostly different because the other engines haven't bothered to make their first-letter behave well.  :(

Comment 4

[David Baron :dbaron: (⌚️UTC-4, no longer working on Mozilla)]

CSS WG agreed to change spec, so we should remove the special handling and match other browsers.