I have a variety of ordered lists that I have to have on the same page; currently using CSS to accomplish this BUT it only works for a single stlye and it gets applied to all ordered lists on the page.

What I want:

List One
001 One
002 Two
003 Three and so on…

List Two

1. One
   1.1 One one
   1.2 One two
2. Two
   2.1 Two one and so on

my css thus far is:

ol {list-style-type: decimal-leading-zero !important;}
ol li:before {content: '0'; position: relative; left: -38px;}

…works for the 001, 002, 003 ordered list only and it gets applied to all ordered lists.

How do I make it so I can have multiple ordered lists on the same page with different styles. I tried calling out the class=”decimal-leading-zero” in the HTML for only the list(s) I want it applied to but it didn’t make a difference. Seems like the CSS I have is applying the style to ALL

< tags

I tried calling out the class=”decimal-leading-zero” in the HTML for only the list(s) I want it applied to but it didn’t make a difference. Seems like the CSS I have is applying the style to ALL

tags regardless of classes in the tags