<ol>
  <li>List Item</li>
  <li>List Item</li>
  <li>List Item
    <ol>
      <li>List Item</li>
      <li>List Item
        <ol>
          <li>List Item</li>
          <li>List Item</li>
          <li>List Item</li>
        </ol>
      </li>
      <li>List Item</li>
    </ol>
  </li>
  <li>List Item</li>
  <li>List Item
    <ol>
      <li>List Item</li>
      <li>List Item</li>
      <li>List Item</li>
    </ol>
  </li>
  <li>List Item</li>
  <li>List Item</li>
</ol>
ol {
  list-style: none;
  counter-reset: cupcake;
  padding-left: 32px;
}
ol li {
  counter-increment: cupcake;
}
ol li:before {
  content: counters(cupcake, ".") ". ";
}

External CSS

  1. https://codepen.io/chriscoyier/pen/GRpqNwX

External JavaScript

This Pen doesn't use any external JavaScript resources.

Packages

This Pen doesn't use any packages.