I want to use decimal, upper-alpha, lower-alpha, upper-roman, and lower-roman for first five level respectively. I tried doing this by writing CSS in pad.css
.list-number1 li:before {
content: counter(first)") " ;
counter-increment: first;
list-style-type: lower-alpha;
}
I tried just one for testing but it didn't work. I wanted to control the character after the counter which worked fine putting ") "
using content
but list-style-type
doesn't seem to be working here. Can someone point me to the right direction?
This worked for me
.list-number1 li:before {
content: counter(first, decimal)". " ;
counter-increment: first;
}
.list-number2 li:before {
content: counter(second, upper-alpha)") " ;
counter-increment: second;
}
.list-number3 li:before {
content: counter(third, lower-alpha)") " ;
counter-increment: third;
}
.list-number4 li:before {
content: counter(fourth, upper-roman)") " ;
counter-increment: fourth;
}
.list-number5 li:before {
content: counter(fifth, lower-roman)") " ;
counter-increment: fifth;
}