How to align two columns of text in CSS

Question

I\'m having some trouble lining up some text. I need two columns, one with numbers and one with text, like so:

1 Entry one
2 Entry two
3 Entry three
4 Entry

Answer 1

You should just use an appropriately styled ol element, something like this:

See: http://jsfiddle.net/tPjQR/

If you want to have different styles on the number versus the list content, you'll need to wrap the content of each li in something like a span. There just isn't a better way.

ol {
    font-family: Georgia, serif;
}
ol span {
    font-family: Arial, sans-serif;
    font-size: 17px
}

    
Entry one
    
Entry two
    
Entry three
    
Entry five
    
Entry six
    
Entry Long Long Long Long Long Long Long Long Long Long Long Long Long Long Long Long Long