Remove outdenting of ordered list numbers

  • Resolved jack_martin_leith

    (@jack_martin_leith)


    1 year, 3 months ago

    I’ll be grateful if you can provide the CSS that makes the numbers of ordered list items flush with the content instead of outdenting them. Thank you, and Happy New Year.

Viewing 3 replies - 1 through 3 (of 3 total)
  • karlalevelup

    (@karlalevelup)

    1 year, 3 months ago

    Hi there!

    Happy New Year!

    Here’s a CSS code that you could use to move the ordered list numbers inside the content area aligned with the rest of the content:

    ol {
      list-style-position: inside;
      padding-left: 0;
    }

    If you need it for the bullets/unordered lists too, use this one instead:

    ol, ul {
      list-style-position: inside;
      padding-left: 0;
    }

    Let me know if I can help you further.

    Thread Starter jack_martin_leith

    (@jack_martin_leith)

    1 year, 3 months ago

    Hiya Karla.

    Thanks very much for your response.
    CSS for both lists now installed on both of my sites, and working perfectly,
    Warm wishes from the west of England.
    Jack

    Thread Starter jack_martin_leith

    (@jack_martin_leith)

    1 year, 3 months ago

    Hello again Karla.

    You kindly provided the following CSS to remove outdenting of numbered and bulleted lists:

    ol { list-style-position: inside; padding-left: 0;}

    ol, ul { list-style-position: inside; padding-left: 0;}

    Small problem: The hanging functionality is now missing.

    Is there any way of resolving this, or is it simply a tradeoff?

    Thanks. Jack

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Remove outdenting of ordered list numbers’ is closed to new replies.