How to create centered ordered list with HTML/CSS?

Question

I'd like to create a simple centered ordered list like the following:

    1. one
   2. three
  3. fifteen
    4. two

Everything I'm trying makes the number align flush to the left, rather than stay to the right next to the item. How do I get the result above?

Answer 1

use

.centered { text-align: center; list-style-position:inside; }

<ol class="centered">
  <li>one</li>
  <li>three</li>
  <li>fifteen</li>
  <li>two</li>
</ol>