WordPress.org

Ready to get started?Download WordPress

Forums

Embeded Unordered List in Ordered List Not Working (5 posts)

  1. jackdaniel
    Member
    Posted 3 years ago #

    I've been trying to get a bulleted/unordered list embeded within an ordered list. I'm pretty sure the HTML is correct, but it is not displaying correctly. Can someone take a look?

    Here's the site:
    http://www.waterwhip.com/tips-and-tricks/buying-a-boat/

    Here's the code:

    [Code moderated as per the Forum Rules. Please use the pastebin]

    Thanks!

  2. jackdaniel
    Member
    Posted 3 years ago #

    bump

  3. Richard Coan
    Member
    Posted 3 years ago #

    Your unordered list is inheriting the ordered list "list-style:decimal" style.

  4. Richard Coan
    Member
    Posted 3 years ago #

    For CSS issues you should really use a in-browser code inspector, Chrome has one built in in the context menu by right clicking on the element and choosing inspect element. Firefox has several, ive used both Firebug (my favorite with CSS) and Web Developer (my favorite with JavaScript). Note that both of these plugins on Firefox WILL slow your browser down.

  5. alchymyth
    Forum Moderator
    Posted 3 years ago #

    the list-style-types are wrongly styled on the li elements;

    .post ul li, .single-main ul li{list-style-image:none; list-style-position:outside; list-style-type:disc; padding:3px 0}
    .post ol li, .single-main ol li{list-style-image:none; list-style-position:outside; list-style-type:decimal; padding:3px 0}

    rearranging the styles in this way should work:

    .post ul { list-style-type:disc; list-style-image:none; list-style-position:outside; }
    .post ol { list-style-type:decimal; list-style-image:none; list-style-position:outside; }
    .post ul li, .single-main ul li{  padding:3px 0; }
    .post ol li, .single-main ol li{  padding:3px 0; }

    http://www.w3schools.com/Css/css_list.asp

Topic Closed

This topic has been closed to new replies.

About this Topic