| Summary: | Right aligned text with line clamp does not show an ellipsis. | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Olga Giza <olka48> | ||||||
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> | ||||||
| Status: | RESOLVED FIXED | ||||||||
| Severity: | Minor | CC: | deeo-sama, karlcow, koivisto, mmaxfield, simon.fraser, smoley, webkit-bug-importer, zalan | ||||||
| Priority: | P2 | Keywords: | BrowserCompat, InRadar | ||||||
| Version: | WebKit Nightly Build | ||||||||
| Hardware: | Mac | ||||||||
| OS: | macOS 10.14 | ||||||||
| Bug Depends on: | |||||||||
| Bug Blocks: | 233770 | ||||||||
| Attachments: |
|
||||||||
Created attachment 415569 [details]
test case
Thanks for filing, I can reproduce this on Safari 13.1.3 - STP 116. This bug also reproducible for RTL languages (such as Arabic or Hebrew) with dir attribute set to 'rtl' or 'auto' and text-align: left Created attachment 461655 [details]
rendering in Safari, firefox, chrome
Tested in
Firefox Nightly 105.0a1
Google Chrome Canary 106.0.5242.0
Safari 16.0
Chrome doesn't show any ellipsis
As for Comment #4, this is different, see Bug 219817 But fwiw, The bug here as reported initially seemed to say that there was no ellipsis. Currently there is as you can see in https://bugs.webkit.org/attachment.cgi?id=461655 So this bug seems to be fixed? |
Combination of line-clamp and text-align: right is not working properly. Ellipsis not displayed (it is outside of the container - we can see that when overflow: hidden prop is removed) Example: ``` <style> p { width: 200px; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; white-space: normal; text-align: right; } </style> <p> long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text </p> ``` Might be related to https://bugs.webkit.org/show_bug.cgi?id=219100