Bug 53147

Summary: CSS 2.1 Failure: table-anonymous-object-188 ::after on an inline parent messes up anonymous table box creation around table-cell boxes
Product: WebKit Reporter: Tab Atkins <tabatkins>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Normal CC: ahmad.saleem792, ap, hyatt, rniwa, robert, simon.fraser, zalan
Priority: P2 Keywords: WPTImpact
Version: 528+ (Nightly build)   
Hardware: PC   
OS: OS X 10.5   
URL: http://wpt.live/css/CSS2/tables/table-anonymous-objects-188.xht
Bug Depends on:    
Bug Blocks: 47141    
Attachments:
Description Flags
Safari 15.5 matches Chrome but differs from Firefox none

Tab Atkins
Reported 2011-01-25 17:02:47 PST
In the linked test case, "b" and "c" are in table-cell blocks that should be grouped by a single anonymous table box. However, the #t::after{} rule, which creates an ::after pseudoelement as a sibling of the spans containing "b" and "c", forces the "b" and "c" to generate individual anonymous table boxes, so they sit on separate lines. As the linked case is relatively complex, here is a stripped test case: <!doctype html> <style> #wrong > span { display: table-cell; } #wrong::after { content: "fail"; } #right > span { display: table-cell; } #right::before { content: "win"; } #alsoright > span { display: table-cell; } #alsoright::after { content: "win"; } </style> <span id=wrong> <span>a</span> <span>b</span> </span> <hr> <span id=right> <span>a</span> <span>b</span> </span> <hr> <div id=alsoright> <span>a</span> <span>b</span> </div> Special notes: 1. This only happens is #t is inline. 2. This only happens if you generate an ::after. Generating ::before doesn't cause any problems. 3. Having actual text at the end, rather than a generated ::after, doesn't cause any problems.
Attachments
Safari 15.5 matches Chrome but differs from Firefox (423.01 KB, image/png)
2022-06-21 17:04 PDT, Ahmad Saleem 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Ahmad Saleem
Comment 1 2022-06-21 17:04:43 PDT
Created attachment 460394 [details] Safari 15.5 matches Chrome but differs from Firefox I am able to reproduce this bug based on the attached URL in Safari 15.5 on macOS 12.4. Please refer to updated results across all browsers in attached screenshot. Only Firefox renders the text output without any 'red', while Safari and Chrome matches each other. If there is any web-spec issue and Firefox is not correct then this can be marked as "RESOLVED CONFIGURATION CHANGED" else this can continue to be investigated till proper fix. Thanks!
Ahmad Saleem
Comment 2 2022-06-21 17:08:06 PDT
Further, I changed the reduction from Comment 01 into JSFiddle: Link - https://jsfiddle.net/7p459ezm/show ^In above as well, Firefox shows "ab fail" with space compared to Safari 15.5 and Firefox, which shows it as "abfail".
Ryosuke Niwa
Comment 3 2022-06-21 17:13:12 PDT
*** Bug 53144 has been marked as a duplicate of this bug. ***
Ahmad Saleem
Comment 4 2023-05-19 09:10:20 PDT
It it also on WPT, so adding WPTImpact tag.
Note You need to log in before you can comment on or make changes to this bug.