As an alternative and superior solution, you could use a custom counter in a before element. It involves no extra HTML markup. A CSS reset should be used alongside it, or at least styling removed from the ol
element (list-style-type: none, reset margin
), otherwise the element will have two counters.
<ol>
<li>First line</li>
<li>Second line</li>
</ol>
CSS:
ol {
counter-reset: my-badass-counter;
}
ol li:before {
content: counter(my-badass-counter, upper-alpha);
counter-increment: my-badass-counter;
margin-right: 5px;
font-weight: bold;
}
An example: http://jsfiddle.net/xpAMU/1/