RESOLVED DUPLICATE of bug 319211325258
Support CSS generated content in list ::marker pseudo-elements
https://bugs.webkit.org/show_bug.cgi?id=325258
Summary Support CSS generated content in list ::marker pseudo-elements
Richard Rutter
Reported 2026-09-25 01:06:36 PDT
According to CSS Lists and Counters Module Level 3 the ::marker pseudo element should support the `content` property (https://www.w3.org/TR/css-lists-3/#marker-properties) This is supported in Chrome and Firefox but not WebKit. The use case is to change the content of the markers to customise bullets or numbering without resorting to much more verbose @counter-style rules. For example: 👉️ You could mark all list items with a pointing hand bullet. 1) You could number items with a parenthesis instead of a full stop. To do so, use the content property and the counter() function like this: `` ul li::marker { content: "👉️ "; } ol li::marker { content: counter(list-item) ") "; } `` Live example here: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Selectors/::marker#try_it
Attachments
Tim Nguyen (:ntim)
Comment 1 2026-09-25 10:06:27 PDT
*** This bug has been marked as a duplicate of bug 319211 ***
Note You need to log in before you can comment on or make changes to this bug.