Did You Know the Ordered List Element Has Start and Reversed Attributes?

Avatar of Robin Rendle
Robin Rendle on

DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit!

I sure didn’t! Tomek Sułkowsi shows how we can reverse the numbering of ordered lists with a simple HTML attribute:

<ol reversed>
  <li>Apple</li>
  <li>Banana</li>
  <li>Pear</li>
</ol>

And the start attribute can be added to begin the list at a number other than one, like this:

<ol start="2">
  <li>Apple</li>
  <li>Banana</li>
  <li>Pear</li>
</ol>

I’m not sure how I never knew about these properties! I guess I can see how they might come in handy in the future. There are plenty of times when we need to break up ordered lists here on CSS-Tricks with things like code blocks and having a way to pick a list back up where it left off is a nice convenience.