Yves Forkl wrote:
> XXE 3.8.1 seems to behave in a strange manner with respect to the
> counter-reset CSS instruction as soon as you try to reset several
> counters at once.
>
> Say I have 3 element types A, B and C (whose instances are siblings)
> with counters named as "...-num" for each of them, like this:
>
> A:before
> {
> display: block;
> counter-increment: A-num;
> content: element-local-name() " " counter(A-num, decimal);
> }
>
> B:before
> {
> display: block;
> counter-increment: B-num;
> content: element-local-name() " " counter(B-num, decimal);
> }
>
> C:before
> {
> display: block;
> counter-increment: C-num;
> content: element-local-name() " " counter(C-num, decimal);
> }
>
> As the A, B and C instances rather reflect a hierarchy for me (but need
> to stay siblings), I want to reset the counter of C in B and the
> counters of B and C in A. So I am trying to accomplish that last task
> using:
>
> A:before
> {
> display: block;
> counter-increment: A-num;
> content: element-local-name() " " counter(A-num, decimal);
> counter-reset: B-num;
> counter-reset: C-num;
> }
>
> Strangely enough, it is always only the second of both reset-counter
> instructions that will take effect while the other one is ignored
> (proved by reversing their order). Same result when the selector reads
> just "A".
>
> The only workaround seems to be to spread the two counter-reset
> instructions over several CSS rules, as the following achieves the
> desired result of resetting both counters (no matter which counter-reset
> instruction is placed with which of both rules):
>
> A:before
> {
> display: block;
> counter-increment: A-num;
> content: element-local-name() " " counter(A-num, decimal);
> counter-reset: B-num;
> }
>
> A
> {
> display: block;
> counter-reset: C-num;
> }
>
> Strange, isn't it?
--> Not really. It is probably a bug, but we cannot fix it due to the
way the CSS engine has been implemented.
A rule like:
foo {
bar: 1;
bar: 2;
bar: 3;
}
is equivalent to:
foo {
bar: 3;
}
because a rule is implemented as a set of properties (keyed by the name
of the property) and not as a list of properties.
--> Now the actual workaround is easy, clean and conforming to the CSS
standard:
A:before
{
display: block;
counter-increment: A-num;
content: element-local-name() " " counter(A-num, decimal);
counter-reset: B-num C-num; /*Reset *two* counters at once*/
}
I've not tried it but I don't see why it wouldn't work.