1433555 - first-letter

Status: RESOLVED DUPLICATE of bug 362880

(Core :: Layout: Block and Inline, defect)

Description

[frlinw]

Attachment: first-letter_bug.JPG

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.132 Safari/537.36

Steps to reproduce:

https://codepen.io/frlinw/pen/goVdwO


Actual results:

1) ::first-letter cause extra space on a `display: inline-block` element
2) ::first-letter does not affect `display: inline-flex` elements


Expected results:

1) ::first-letter should not introduce extra space to the element
2) ::first-letter should work on inline-flex elements

Comment 1

[Cristina Badescu [:cbadescu], Experiments QA]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:60.0) Gecko/20100101 Firefox/60.0
Build ID: 20180130223236

I have tested this issue on latest Firefox release 58.0.1, latest Nightly build 60.0a1 and managed to reproduce it. I have accessed the provided link and observed that the "inline-block" element has an extra space.
This issue is also reproducible on older Nightly builds, such as 48.0a1 (2016-03-07).

This issue is not reproducible on Chrome.

I think the suitable component for this issue might be Core:: Layout: Block and Inline.

Comment 2

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

Attachment: reporter's testcase

Comment 3

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

This is related to intrinsic width computation using text-transform: uppercase for the whole thing, not just the first letter.