[Support request] Ordered list wrong numbering

[Shivam]

Hey, Whenever I add content between two ordered lists the sl.no don’t continue from the previous one. It starts from 1, even though I assign the starting value (check screenshot) (Page link)

I have custom CSS for styling the numbered list which is the reason behind this:

.entry-content ol {list-style-type: none;}
.entry-content ol {counter-reset: list-counter;}
.entry-content ol > li::before {content: counter(list-counter);counter-increment: list-counter;float: left;width: 20px;height: 21px;line-height: 20px;text-align: center;color: #fff;background: #00b0eb;border-radius: 100%; margin-top: 9.5px;margin-left: -30px; font-weight:900;font-size: 14px;}

Can you please modify the code so the sl.no works continuously…

[David]

Hi there,

change this line:

.entry-content ol {
    counter-reset: list-counter;
}

to:

.entry-content {
    counter-reset: list-counter;
}

[Shivam]

Hey David, It did not work properly. Now whenever I add a new ordered list on any other section of a page, it still continues from the last sl no appeared above on the page instead of starting from 1.

Check the updated page here

[David]

Sorry you didn’t say you wanted to maintain multiple OL counted lists.
To do that would require you to introduce sections on the page to ‘contain’ each counted list.

Use a GenerateBlocks Container Block, with that block selected, in Advanced > Additional CSS class(es) add: list-container

Then change this CSS:

.entry-content {
    counter-reset: list-counter;
}

to:

.entry-content .list-container {
    counter-reset: list-counter;
}

Now anything inside that container will keep the count order.

So simply copy and paste the Cotnainer Block and use it for each separate list you require

[Author]

Posts