Intent to Prototype: CSS symbols() function
48 views
Skip to first unread message
Ananya Anand
3:55 PM (6 hours ago) 3:55 PM
to blin...@chromium.org, Hoch Hochkeppel (HE/HIM), Javier Contreras Tenorio
Hey @Blink Reviewers,
This implements the CSS symbols() function from CSS Counter Styles Level 3 which is an already-defined consensus standard Firefox has shipped since ~2015 but Chrome/Edge/Safari have not. It lets authors define an anonymous counter style inline instead of
first declaring a named @counter-style .
Contact emails:
Explainer:
Specification:
Summary:
The CSS symbols() function lets authors define a counter style inline instead of first declaring a named @counter-style at-rule. It builds an anonymous counter style from a list of string symbols plus an optional counting system (cyclic, numeric, alphabetic,
symbolic, or fixed), and is accepted as the counter style in list-style-type, the list-style shorthand, and counter() / counters().
Blink component:
Blink>CSS
Web feature ID:
Counter-style
Motivation
Defining a custom list marker in CSS today requires authoring a named @counter-style rule and referencing it by name, which is needlessly verbose for one-off, anonymous markers. The symbols() function lets authors define the same counter style inline, without
inventing or managing a global name. It works wherever a counter style is accepted, specifically in list-style-type and the counter()/counters() functions. Gecko has supported symbols() since 2015, but Blink and WebKit have not, so this addresses an important
interoperability gap.
Initial public proposal
N/A: implementation of an existing consensus standard.
Search tags:
css, counter-style, symbols, list-style, counters
Goals for experimentation:
None
Requires code in //chrome?:
False
Tracking bug:
Estimated milestones:
No milestones specified.
Link to entry on the Chrome Platform Status:
Reply all
Reply to author
Forward
0 new messages