-
Notifications
You must be signed in to change notification settings - Fork 756
Description
#6096 added the reversed() syntax to the counter-reset property.
However, unless I'm missing something, these are totally equivalent:
counter-reset: c 7;
counter-reset: reversed(c) 7;The only difference is that the latter instantiates the counter with a reversed flag, but this flag only seems relevant in these cases:
- When omitting the starting value (it's
7in the example) - In the implicit
list-itemcounter (it'scin the example)
So IMO we have two reasonable possibilities:
-
Drop the useless
<reversed-counter-name> <integer>syntax, and just keep<reversed-counter-name>.The reversed flag of the counter would then be set by
<reversed-counter-name>and also whencounter-resetinstantiates alist-itemcounter in an<ol reversed>. The preshint for reversed HTML lists would be:ol[reversed] { counter-reset: reversed(list-item); } ol[reversed][start] { counter-reset: list-item calc(attr(start integer) + 1); /* with reversed flag */ }
-
Keep
<reversed-counter-name> <integer>, but then negate increments not just tolist-itembut to all counters. That is,list-itemcounters would getcounter-increment: list-item 1by default, not -1 for reversed lists. And when incrementing a reversed counter, the specified amount would actually be decremented. So<style> #parent { counter-reset: reversed(c) 7; } #parent > .child { counter-increment: c 2 } /* Decrements since the counter is reversed */ #parent > .child::before { content: counter(c) ". " } </style> <div id="parent"> <div class="child">foo</div> <div class="child">bar</div> </div>
would look like
5. foo 3. bar
The latter seems more useful for authors, and makes list-item less magic.