[csswg-drafts] [css-overflow-3] What does it mean for `text-overflow: ellipsis` to clip the first character of a line? (#9545)

andreubotella has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-overflow-3] What does it mean for `text-overflow: ellipsis` to clip the first character of a line? ==
[The specification for the `text-overflow` property](https://drafts.csswg.org/css-overflow-3/#text-overflow) talks about "clipping" the text to the end of the line box when `text-overflow` is set to `clip`. A straightforward reading would seem to imply that the mere presence of `text-overflow: clip` would cause overflowing text to be clipped at the end of the line box, *in addition* to the clipping at the padding edge of the block container caused by `overflow`. This is observable if the block container has inline-end padding. No browser does this, instead letting the `overflow` property clip the text at the padding edge (or outside of it, with `overflow-clip-margin`).

The verb "clip" also appears in the spec text for `text-overflow: ellipsis`:
> For the ellipsis value implementations must hide characters and atomic inline-level elements at the end edge of the line as necessary to fit the ellipsis, and place the ellipsis immediately adjacent to the end edge of the remaining inline content. The first character or atomic inline-level element on a line must be clipped rather than ellipsed.

It is clear that the ellipsis would not displace the first character (or atomic inline) as it would others. Furthermore, by the interpretation of "clip" above, it would follow that if the first character by itself is enough to overflow the line box but not the block container's padding edge, then it would not be clipped.

What isn't clear, and what browsers disagree on, is whether an ellipsis would be painted after the first character if it would fit in the padding edge (or overflow clip margin). Webkit and (LayoutNG) Chromium do paint it, while Firefox doesn't. It also seems like legacy layout Chromium didn't paint the ellipsis, and AFAIK this change wasn't noticed.

Test case: https://codepen.io/andreubotella/pen/GRzqGvg

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/9545 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 1 November 2023 12:20:56 UTC