Problem getting ol li to show in Metro

Community Forums Forums Design Tips and Tricks Problem getting ol li to show in Metro

This topic is: resolved

This topic contains 7 replies, has 2 voices, and was last updated by  Doug 1 year, 1 month ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #49849

    Doug
    Participant
    Post count: 80

    Hello,

    I am having difficulty getting my ol li to show as a numbered list; could anyone shed some light for me?

    The url is: http://dev.health-safetysolutions.com/e-learning/

    This content in the right sidebar should be in an ordered list:

    <div id=”Elearning”>

    1. Go to http://health-safetysolutions.com/360training.com
    2. Select a Course Library (Construction, General Industry, Hazardous Waste).
    3. Select the desired course by clicking on the check box located next to the course title, and then “add to cart.”
    4. Verify the course title and quantity and click on the “checkout and proceed” button.
    5. Provide student information on the registration page and click on “information correct proceed with registration.”
    6. On the billing page, select method of payment, fill in the appropriate data fields and click on “information correct proceed with registration.”
    7. The next page will show a confirmation receipt, with student’s login information.
    8. Proceed to take the course.

    </div>

    Thank you,
    Doug

    http://dev.health-safetysolutions.com/e-learning/
    #49854

    David Chu
    Participant
    Post count: 1355

    Hi,
    They’re there, but hiding. A little pinch of left margin will bring them in:

    [css]
    .sidebar ol li {
    margin-left: 40px;
    }
    [/css]

    Adjust to taste. :)

    Dave


    Dave Chu · Custom WordPress Developer – likes collaborating with Designers

    #49866

    Doug
    Participant
    Post count: 80

    Hi Dave

    I tried this; but, it’s still not working:

    #Elearning ol li {
    margin-bottom: .5em;
    margin-left: 40px;
    margin-left: 2.5rem;
    }

    Am I missing something?

    Thank you!
    Doug

    #49878

    David Chu
    Participant
    Post count: 1355

    Yup, your new code is at a teeny responsive level. You’ll want that command at all levels. :-)


    Dave Chu · Custom WordPress Developer – likes collaborating with Designers

    #49882

    Doug
    Participant
    Post count: 80

    David,

    It’s still not working…

    I have taken away the responsive code and given the ol a class of .entry-content; and, it still won’t work:

    1. Go to http://health-safetysolutions.com/360training.com
    2. Select a Course Library (Construction, General Industry, Hazardous Waste).
    3. Select the desired course by clicking on the check box located next to the course title, and then “add to cart.”
    4. Verify the course title and quantity and click on the “checkout and proceed” button.
    5. Provide student information on the registration page and click on “information correct proceed with registration.”
    6. On the billing page, select method of payment, fill in the appropriate data fields and click on “information correct proceed with registration.”
    7. The next page will show a confirmation receipt, with student’s login information.
    8. Proceed to take the course.

    =======

    06 Lists
    —————————————————————————————————- */

    .entry-content ol,
    .entry-content ul {
    margin-bottom: 26px;
    margin-bottom: 1.625rem;
    }

    .entry-content ol li,
    .entry-content ul li {
    line-height: 1.625;
    }

    .entry-content ol li,
    .entry-content ul li {
    margin-left: 40px;
    margin-left: 2.5rem;
    }

    .entry-content ol li {
    list-style-type: decimal;
    }

    .entry-content ul li {
    list-style-type: disc;
    }

    .entry-content ol ol,
    .entry-content ul ul {
    margin-bottom: 0;
    }

    /*

    ====================
    Sorry to bother you, Dave; this is really bumming me out.

    Doug

    • This reply was modified 1 year, 1 month ago by  Doug. Reason: To show that I gave it the right code
    • This reply was modified 1 year, 1 month ago by  Doug. Reason: To show that I gave it the right code
    #49888

    Doug
    Participant
    Post count: 80

    Dave,

    My mistake: I fixed it:

    I needed to code a div with a class of entry-content around the whole ol.

    Thank you VERY MUCH for your time and valuable help. I deeply appreciate it!!!

    Peace, Doug

    #49898

    David Chu
    Participant
    Post count: 1355

    Doug,
    Glad you got it sorted!

    I don’t get asked for OL’s that often, but I think they look great.

    D


    Dave Chu · Custom WordPress Developer – likes collaborating with Designers

    #49916

    Doug
    Participant
    Post count: 80

    Yeah, Dave

    Especially when there are instructions or directions to be followed in a certain sequence.

    Namasté,
    Doug :-)

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

You must be logged in to reply to this topic.