Question

I know in HTML you can use <ol><li></li></ol> to get a nice ordered list but doing that with list-style-type: decimal always increments the number by 1.

I’m looking for a way to set the value of the bullet text.

I might end up with a list that looks something like

12 item
22 item
 2 item

I don’t want to do any crazy use of images if at all possible.
Is there an easy solution for this?

I have HTML, CSS, javascript (jquery) and PHP available.

Answer 1

That isn’t really an ordered list then is it? You should just emulate a bullet in an unordered list:

<ul>
  <li><span>22</span> item
</ul>

Remove the bullet with list-style-type: none then style to taste.