Bug 282934

Summary: CSS counters not functioning properly when container-type is set.
Product: WebKit Reporter: Doug Wollison <doug>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: RESOLVED DUPLICATE    
Severity: Normal CC: karlcow, koivisto, ntim, vitor.roriz, webkit-bug-importer
Priority: P2 Keywords: BrowserCompat, InRadar
Version: Safari Technology Preview   
Hardware: Unspecified   
OS: Unspecified   
Attachments:
Description Flags
rendering in safari, firefox, chrome none

Doug Wollison
Reported 2024-11-11 08:53:32 PST
It appears that containment and counters don't seem to play nice together. I have a list of items, and for design reasons I need to render the counter as a pseudo element on the item within. When I apply a container-type to the list items though, it breaks the counter handling. This is regardless of if I use a custom counter or the native list-item one. Codepen demonstrating the issue: https://codepen.io/dougwollison/pen/GRVPxvo If I had to hazard a guess, the containment seems to undo/revert counter-increment, and possibly trigger a counter-reset as well. You can see that my custom counter example, which increments on the .card items rather than list items, all show 1.
Attachments
rendering in safari, firefox, chrome (1.06 MB, image/png)
2024-11-11 21:47 PST, Karl Dubost 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Karl Dubost
Comment 1 2024-11-11 21:47:45 PST
Created attachment 473202 [details] rendering in safari, firefox, chrome Safari displays list-item: 0 while it is being incremented on Chrome and Firefox.
Radar WebKit Bug Importer
Comment 2 2024-11-11 21:48:22 PST
<rdar://problem/139698509>
Karl Dubost
Comment 3 2024-11-11 21:50:42 PST
That looks like a duplicate of Bug 260436
Karl Dubost
Comment 4 2024-11-11 21:50:57 PST
*** This bug has been marked as a duplicate of bug 260436 ***
Note You need to log in before you can comment on or make changes to this bug.