Home/ Questions/Q 8078089
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-05T15:40:49+00:00

By default, the ordered list looks like this: There are some spacing on the

  • 0

By default, the ordered list looks like this:

enter image description here

There are some spacing on the left hand side of the list. Is there any way to remove those spacing?

Here is what I want:

enter image description here

On my website, the font-family and font-size will be changed by users dynamically. Therefore I am not able to preset padding-left.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You should be able to use em for a scalable size (rather than fixed px sizing). This would allow scaling of the font size but match the scaled size when applying padding.

    ol { padding-left: 1.8em; }

    Here is a jsfiddle to illustrate. Change the body font-size to different scaled sizes (try 1em, 2em, etc.) and you’ll see the paragraph matches the ol on the left.

    You may find that browsers render at different sizes. 1.8em, works with Chrome, but it may require 1.6em or 1.9em for Firefox or IE. The thing with the web is it is fluid and scalable, so shooting for pixel precision, especially when working with user-scalable fonts is almost always a no-win situation.

    • 0