CODEWITHSUNDEEP
htmlcss
roflwaffle
roflwaffle

Reputation: 30656

Need to right align decimal number in ol list

I have a standard ol list:

1. One
2. Two
10. Ten

Is there any way to get the decimal number to right align so that it looks like this:

 1. One
 2. Two
10. Ten

EDIT: Screenshot. Top is Typekt (Proxima Nova) font-weight normal. Bottom is sans-serif.

Only relevant style is: ol { list-style-position: inside; }

Upvotes: 3

Views: 3367

Answers (1)

Michael Liu
Michael Liu

Reputation: 55419

Aren't the item numbers right-aligned by default? At least they are in IE and Firefox:

<ol>
  <li>One</li>
  <li>Two</li>
  <li value="10">Ten</li>
</ol>

UPDATE: The problem is that (1) list-style-position is set to inside, so the item number appears as part of the item content instead of in the left margin, and (2) you're using a font with variable-width digits.

Removing list-style-position: inside would fix the problem. What's the reason that you added it? If a footnote is so long that it wraps, how do you want subsequent lines to be indented?

Upvotes: 3

Related Questions