Skip to content

[css-lists] Add counter-increment: <counter-name> step(<integer>) that negates integer in reversed lists #6800

@Loirooriol

Description

@Loirooriol

Most of the behavior of HTML lists numbering can now be explained in CSS terms, but there is still this remaining piece of magic:
https://drafts.csswg.org/css-lists/#list-item-counter

unless the counter-increment property explicitly specifies a different increment for the list-item counter, it must be incremented by 1 on every list item, or if the counter is reversed, it must be incremented by -1 on every list item instead

When using their own custom counters, authors have no way to specify an amount in counter-increment, and increase by that amount in normal lists, or decrease in reversed lists.

As @MatsPalmgren proposed in #6231 (comment), we could allow counter-increment to accept a step(<integer>) that would just do that.

Then, the implicit list-item counter would get counter-increment: list-item step(1) on list items, that would behave as described in the quote above.

This feature would also make counter-reset: reversed(<counter-name>) <integer> useful, since without step() it behaves exactly as counter-reset: <counter-name> <integer> for counters other than list-item when the integer is not omitted (#6231).

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    Status

    Wednesday afternoon

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions