Reset multiple counters in css
Current situation
counter-reset
in a css file resets the first counter only, even when multiple counters shall be reset.
Example:
.counterReset {
counter-reset: c1 c2 c3;
}
results in
<h2 class="counterReset"
data-ref="4e5dc70d-f926-4bcb-a3db-7b4906c53814"
data-counter-c1-reset="0"
data-counter-reset="c1">Counter reset: in .css</h2>
instead of
<h2 class="counterReset"
data-ref="4e5dc70d-f926-4bcb-a3db-7b4906c53814"
data-counter-c1-reset="0"
data-counter-reset="c1"
data-counter-c2-reset="0"
data-counter-reset="c2"
data-counter-c3-reset="0"
data-counter-reset="c3">Counter reset: in .css</h2>
Target situation
Multiple counters can be reset in a css file.
Workaround
- Inline styling (ugh)
<h2 style="counter-reset: c1 c2 c3;">Counter reset: inline</h2>
- reset each counter individually in css, which i think is not possible to do for the same selector