Generated text before list marker

2 views
Skip to first unread message

Andrew Poulos

unread,
Nov 2, 2020, 1:50:49 AM11/2/20
to
I have a list with
list-style-type: lower-roman;

and I have

li:not([data-cluster="on"])::before {
counter-increment: num;
content: counter(num);
}

For example, the list appears as

i.
ii.1
iii.2
iv.
v.

Is there a way to reverse the order? So I'd get:

i.
1 ii.
2 iii.
iv.

That is, to put the generated content before the list marker?

Andrew Poulos

Andrew Poulos

unread,
Nov 2, 2020, 3:53:53 AM11/2/20
to
To answer my own question (again):

<https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters>

and the "Example of a nested counter" provided the information I needed
as I didn't know that the CSS function "counter" could take a second
parameter for style.

Andrew Poulos

Reply all
Reply to author
Forward
0 new messages