<p>How can I left-align the numbers in an ordered list?</p>

<pre><code>1.  an item
// skip some items for brevity 
9.  another item
10. notice the 1 is under the 9, and the item contents also line up
</code></pre>

<p>Change the character after the number in an ordered list?</p>

<pre><code>1) an item
</code></pre>

<p>Also is there a CSS solution to change from numbers to alphabetic/roman lists instead of using the type attribute on the ol element.</p>

<p>I am mostly interested in answers that work on Firefox 3.</p>

The CSS for styling lists is
here
, but is basically:
```
```
li {
    list-style-type: decimal;
    list-style-position: inside;
}
```
```
However, the specific layout you're after can probably only be achieved by delving into the innards of the layout with something like
this
(note that I haven't actually tried it):
```
```
ol { counter-reset: item }
li { display: block }
li:before { content: counter(item) ") "; counter-increment: item }
```
```