RESOLVED WORKSFORME 115258
text-overflow::clip and ::ellipsis render differently, when floating inline element is present.
https://bugs.webkit.org/show_bug.cgi?id=115258
Summary text-overflow::clip and ::ellipsis render differently, when floating inline e...
zalan
Reported 2013-04-26 07:10:02 PDT
<html> <head> <style> div { overflow: hidden; white-space: nowrap; } input { float: right; } </style> </head> <body> <div> <input type="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis</div> </body> </html> <div> with 'text-overflow: ellipsis;' renders the ellipsis to the left edge of the floating inline element, while with 'text-overflow:: clip' the text is clipped at the right edge of the containing block, overdrawing the input. 'text-overflow: clip' should respect the floating element.
Attachments
text-overflow:clip (364 bytes, text/html)
2013-04-26 07:10 PDT, zalan
no flags
rendering in safari, firefox, chrome (101.87 KB, image/png)
2022-06-02 21:33 PDT, Karl Dubost
no flags
rendering in safari, firefox, chrome with clip (90.26 KB, image/png)
2022-06-02 21:35 PDT, Karl Dubost
no flags
test with ellipsis and clip (816 bytes, text/html)
2022-06-02 21:42 PDT, Karl Dubost
no flags
zalan
Comment 1 2013-04-26 07:10:43 PDT
Created attachment 199830 [details] text-overflow:clip
zalan
Comment 2 2013-04-26 07:15:24 PDT
Karl Dubost
Comment 3 2022-06-02 21:33:58 PDT
Created attachment 459987 [details] rendering in safari, firefox, chrome data:text/html,<!doctype%20html><div%20style="text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:30ch;"><input%20type="text"%20style="width:5ch;background-color:%20gold;float:right;"%20value="ABCD">012345678901234567890123456789</div>
Karl Dubost
Comment 4 2022-06-02 21:35:17 PDT
Created attachment 459988 [details] rendering in safari, firefox, chrome with clip And this time with clip instead of ellipsis data:text/html,<!doctype%20html><div%20style="text-overflow:clip;overflow:hidden;white-space:nowrap;width:30ch;"><input%20type="text"%20style="width:5ch;background-color:%20gold;float:right;"%20value="ABCD">012345678901234567890123456789</div>
Karl Dubost
Comment 5 2022-06-02 21:42:05 PDT
Created attachment 459990 [details] test with ellipsis and clip
Karl Dubost
Comment 6 2022-06-05 22:10:29 PDT
Note You need to log in before you can comment on or make changes to this bug.