Setting the distance between numbers and text in an ordered list.

Discussion in 'HTML' started by richard_quick_uk, Jul 30, 2005.

  1. Hi,

    Quick question that's been bugging me.

    I want to set the distance between the numbers and the txt in an
    ordered list - and I can't for the life of me figure out how in CSS.

    Any ideas?

    The CSS is:

    ol {
    padding: 0;
    margin: 5px 0 10px 0;
    margin-left: 23px;
    color: #cc0000;
    }

    ol li {
    list-style-position: outside;
    margin: 0;
    }

    And the html is:

    <ol>
    <li><a href="#">The top tips text will go here</a></li>
    <li><a href="#">The top tips text will go here</a></li>
    <li><a href="#">The top tips text will go here</a></li>
    </ol>


    Richard Quick
     
    richard_quick_uk, Jul 30, 2005
    #1
    1. Advertisements

  2. richard_quick_uk

    dorayme Guest

    From:
    I'm always forgetting how to do things. Here is one way, perhaps not the
    best, but it works as far as I can see for your list that consists of
    links:

    In the link css instructions put padding-left: 10px; or whatever px you
    want. If you don't want this generally for links then you will need to
    make the links for this a special (like a class).

    A:link { color: #000099; background: #fff; padding-left: 10px;}

    And, of course for hover and visited and active the same or different...

    dorayme
     
    dorayme, Jul 30, 2005
    #2
    1. Advertisements

  3. richard_quick_uk

    rf Guest

    ol li {padding-left: 23px;}

    Cheers
    Richard.
     
    rf, Jul 30, 2005
    #3
  4. richard_quick_uk

    Ed Guest

    Add left padding to the list items: ol li { padding-left: 10px }
     
    Ed, Jul 30, 2005
    #4
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.