I'm trying to do something that used to be really easy before the start
attribute on ol tags was deprecated. I'd just like to have a pair of ordered lists in my page, but start the numbering of the second list where the first one finished. Something like:
1. do stuff 2. do stuff Here's a paragraph 3. do stuff
I've seen that the counter-reset
and counter-increment
CSS properties should be able to achieve this, but I can't get it working. Here's my code so far:
<html> <head> <style type="text/css"> ol li { counter-increment: mycounter; } ol.start { counter-reset: mycounter; } ol.continue { counter-reset: mycounter 2; } </style> </head> <body> <ol class="start"> <li>You can't touch this</li> <li>You can't touch this</li> </ol> <p>STOP! Hammer time.</p> <ol class="continue"> <li>You can't touch this</li> </ol> </body> </html>
To be honest, even if that worked, it wouldn't be ideal. I don't want to have to specify the number reached by the first list in my ol.continue
selector.
What am I doing wrong? What's the minimal HTML/CSS combination required to achieve the desired effect?
Click Select in the Editing group on the Home tab, and then click Select All. Or press CTRL+A. Do one of the following: To number consecutively throughout the document, click Continuous.
If you start a list, then stop to interject some other content, then begin the list again, you could use <ol start="..."> to continue numbering where you left off.
A much easier solution to the OP's problem is the following:
<ol start="X">
Where X is the value of the list you want to continue, so in his sample:
<ol> <li>You can't touch this</li> <li>You can't touch this</li> </ol> <p>STOP! Hammer time.</p> <ol start="3"> <li>You can't touch this</li> </ol>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With