Bug 147877

Summary: Text with text-overflow:ellipsis and text-align: right truncates the ellipsis character
Product: WebKit Reporter: jjohns98684
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: RESOLVED FIXED    
Severity: Normal CC: karlcow, mmaxfield, ntim
Priority: P2    
Version: 525.x (Safari 3.2)   
Hardware: Mac (Intel)   
OS: OS X 10.8   
Attachments:
Description Flags
rendering in Safari, firefox, chrome none

jjohns98684
Reported 2015-08-11 04:18:25 PDT
When using text-overflow:ellipsis in an element where the text is right-aligned, the ellipsis character is never shown. If the text-align property is removed or disabled, the ellipsis occurs. This occurs on OSX Safari 7/8 only. Windows version is not affected, and neither are Chrome/FF/IE 10/11 I created a jsfiddle at http://jsfiddle.net/krd3yxbh/12/ to demonstrate the issue, and the html/css is replicated below: <div class = 'outer-container' id = 'cell-1'> <div class = 'cell-container'> <div class = 'account-cell'> <span class = 'account-currency'> $</span> (1234567.89) <!-- text is truncated at the 6 with no ellipsis character visible. Disable text-align in CSS and ellipsis will show. --> </div> </div> </div> <div class = 'outer-container' id = 'cell-2'> <div class = 'cell-container'> <div class = 'account-cell'> <span class = 'account-currency'> $</span> (1234567.89) <!-- ellipsis shows when text-align is removed --> </div> </div> </div> #cell-1 { top: 40px; text-align: right; } #cell-2 { top: 55px } .outer-container { left: 100px; position: absolute; overflow: hidden; width: 67px; height: 14px; background-color: #FFFFFF; border: 1px solid black; font-size: 11px; } .cell-container { padding: 0px 3px 1px; width: 61px; display: table-cell; height: 14px; vertical-align: middle; font-family: Tahoma, sans-serif; } .account-cell { color: #FF0000; position: relative; width: 52px; white-space: nowrap; overflow:hidden; text-overflow:ellipsis; padding-left: 9px; float: right; } .account-currency { position:absolute; left: 0px; }
Attachments
rendering in Safari, firefox, chrome (238.11 KB, image/png)
2022-06-02 22:15 PDT, Karl Dubost
no flags
Karl Dubost
Comment 1 2022-06-02 22:15:57 PDT
Created attachment 459994 [details] rendering in Safari, firefox, chrome This is now working correctly and should probably be closed.
Tim Nguyen (:ntim)
Comment 2 2022-06-02 23:08:45 PDT
Could be a IFC progression
Note You need to log in before you can comment on or make changes to this bug.