Repository navigation
[css-overflow] [css-text] Interaction between whitespace collapsing and line-clamp #12008
Description
The current spec text for block-ellipsis (which is one of the longhands for line-clamp) says that when an ellipsis is inserted on the last line before clamp, it must be placed after the last soft wrap opportunity that would make the line with the ellipsis not overflow, considering that the content after the ellipsis gets pushed to the next line box or fragment.
However, according to the Unicode line breaking algorithm, ASCII spaces don't have a break opportunity before them, but only after them. Which means any soft wrap opportunity caused by a space would show the ellipsis after the space, not at the end of the word. Or at least that would be the case if the ellipsis inline is added at the end of the line box during line breaking and before phase II of whitespace processing.
There's also the fact that the block-ellipsis spec text allows inserting the ellipsis in the middle of text-wrap: nowrap text, since it only talks about finding the last soft wrap opportunity, and nowrap does not remove wrap opportunities, it just prevents wrapping. Given that, the question comes up of how trailing whitespace would work before the ellipsis inside white-space: pre text. If we just say to collapse as usual according to phase II, and then add the ellipsis, we would still have spaces between the end of the word and the ellipsis in white-space: pre text. Do we want that?
Activity
andreubotella commentedon Mar 26, 2025
cc @emilio @kojiishi @frivoal
[line-clamp] Allow inserting the ellipsis inside nowrap text
[line-clamp] Allow inserting the ellipsis inside nowrap text
[line-clamp] Allow inserting the ellipsis inside nowrap text
Bug 1958309 [wpt PR 51818] - [line-clamp] Allow inserting the ellipsi…
Bug 1958309 [wpt PR 51818] - [line-clamp] Allow inserting the ellipsi…
Bug 1958309 [wpt PR 51818] - [line-clamp] Allow inserting the ellipsi…
Bug 1958309 [wpt PR 51818] - [line-clamp] Allow inserting the ellipsi…
Bug 1958309 [wpt PR 51818] - [line-clamp] Allow inserting the ellipsi…
Bug 1958309 [wpt PR 51818] - [line-clamp] Allow inserting the ellipsi…
frivoal commentedon Jun 6, 2025
Interesting. I think there's several parts in there.
For « nowrap does not remove wrap opportunities, it just prevents wrapping » I suspect that can be changed, and have the definition of
text-wrap-mode: nowrapsay that it suppresses opportunities. In that case, yes, if the whole line (or the whole block) is set to nowrap, then that means you cannot insert the ellipsis in the middle of the line, and you either have to tack it at the very end—including after preserved spaces if any—if there's room, or have to remove the whole line to make room if there isn't, but that seems appropriate: if the content is indivisible, it is indivisible.In terms of wrap opportunities being after, not before, spaces. I agree that we don't want the ellipsis being after a space that would otherwise be removed by phase two, so we need to do ellipsis insertion after phase two.
I think the case where I'm least comfortable is when the line ends with preserved white-space (which is thus not discarded) which hang (as can happen with
white-space: pre-wrap). This is different from the nowrap case: here, we can wrap, but we did ask for preserving. In that case, what would fall out of the above is that the ellipsis would be inserted after the space, even though the line is wrapable. This may also be the desirable behavior (the author did ask for spaces to be preserved after all), but I'm less sure.andreubotella commentedon Jun 6, 2025
We can probably say "soft wrap opportunities were breaking would be allowed (i.e. not
text-wrap: nowrap)" without needing to change css-text.Although I believe the goal is for browsers to implement hanging punctuation eventually, I'm not sure how possible this currently is in Chromium. Maybe it would be doable for line-clamp ellipsis, due to the special way in which we're implementing them, but wouldn't be for other punctuation. But I would need to look into it.
24 remaining items
[line-clamp] Don't insert the line-clamp ellipsis inside nowrap text
[line-clamp] Don't insert the line-clamp ellipsis inside nowrap text
andreubotella commentedon Oct 1, 2025
web-platform-tests/wpt#55181 adds one more test, and fixes two existing tests that don't work with either this issue or #12811.
[line-clamp] Don't insert the line-clamp ellipsis inside nowrap text
[line-clamp] Don't insert the line-clamp ellipsis inside nowrap text
Bug 1992123 [wpt PR 55158] - Block-ellipsis and collapsible white spa…
Bug 1992170 [wpt PR 55181] - [line-clamp] Don't insert the line-clamp…
Bug 1992123 [wpt PR 55158] - Block-ellipsis and collapsible white spa…
Bug 1992170 [wpt PR 55181] - [line-clamp] Don't insert the line-clamp…
Bug 1992123 [wpt PR 55158] - Block-ellipsis and collapsible white spa…
Bug 1992170 [wpt PR 55181] - [line-clamp] Don't insert the line-clamp…
Bug 1992123 [wpt PR 55158] - Block-ellipsis and collapsible white spa…
Bug 1992170 [wpt PR 55181] - [line-clamp] Don't insert the line-clamp…
Block-ellipsis and collapsible white space
[line-clamp] Don't insert the line-clamp ellipsis inside nowrap text