Treehouse: Grow your CSS skills. Land your dream job.

Chrome Ordered Lists Centered, but numbers dont follow

  • # January 17, 2012 at 8:53 pm

    I cant provide a link at this time, but hopefully someone knows this issue and the fix for it.

    I have a Numbered OL on my site, and this OL is also centered on the page.

    The numbers, are left behind, off to the left of the page, while the actual content of the OL is centered properly

    something like this


    Hello there

    Nice list!

    The Hyphens, being the Space between…

    i sure hope people stop making new browsers…. pretty ridiculous

    # January 17, 2012 at 9:10 pm

    Wow, that is totally ridiculous! I guess I’ve never needed to do that before. It’s a bit of a head scratcher, I’m sure there’s a way around it, I just can’t think of it!

    # January 17, 2012 at 10:12 pm


    # April 18, 2012 at 8:32 pm

    you will need to use:
    padding-left: 40px;

    obviously the number is up to you. try that with the ol property in your css.

    if you want to further indent the actual list item i.e. hello there, etc, i tend to then use text-indent.

    hope this helps. fb

    # April 18, 2012 at 9:33 pm

    @TheDoc It isn’t actually, as I am assuming that @mikeman is simply using text-align: center; to center the list items (which is then expected behaviour).

    If you use this, it works as expected:

    EDIT: Just noticed that this thread isn’t current, my apologies.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.