Can the numbers in a list be left-aligned?

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

Dave Rado - 27 Dec 2007 10:21 GMT

Is it possible with css to make the numbers in a numbered list left-
aligned (as in this mock-up where I've used 2-column tables to achieve
it: http://tinyurl.com/yv6njd - as opposed to the default of right-
aligned numbers as in this mock-up: http://tinyurl.com/2dxer5)?

And if it *is* possible, can one define the size of the hanging
indent, so that it looks like my left-aligned mock-up looks?

Dave

Reply to this Message

dorayme - 27 Dec 2007 19:59 GMT

In article
<5c3c46cf-d374-4bc9-893c-4d8e1e0efe28@s19g2000prg.googlegroups.co
m>,

> Is it possible with css to make the numbers in a numbered list left-
> aligned (as in this mock-up where I've used 2-column tables to achieve
> it: http://tinyurl.com/yv6njd - as opposed to the default of right-
> aligned numbers as in this mock-up: http://tinyurl.com/2dxer5)?

li {list-style-position: inside;} might get you the numbering
alignment you want. But at the cost of not getting the text
alignment you want!

(Frankly, and perhaps btw, I see the normal right aligned numbers
as being far more natural and better, think what happens when you
get into big numbers.)

Anyway, if you really want what you want, I have cleared the way
for you in another thread to use a table. Here is an excellent
demonstration of a good reason to replace a simple two col table
for an ordered list. Why bother with trying to dream up css
tricks to achieve your aim?

> And if it *is* possible, can one define the size of the hanging
> indent, so that it looks like my left-aligned mock-up looks?

Signature

dorayme

Reply to this Message

Dave Rado - 28 Dec 2007 18:42 GMT

> In article
> <5c3c46cf-d374-4bc9-893c-4d8e1e0ef...@s19g2000prg.googlegroups.co
[quoted text clipped - 24 lines]
> --
> dorayme

I agree that right-aligned numbering is more "natural" *conceptually*,
but it doesn't look nearly as nice in my opinion, and if you look at
printed documents, the numbering is almost always left-aligned.

As a programmer I can see why one would prefer right-aligned; but as a
user, I think left-aligned is much easier on the eye.

I'll take your advice and use tables for this.

Many thanks again

Dave

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / December 2007

Can the numbers in a list be left-aligned?