This forum is now read-only. Please use our new forums! Go to forums

0 points
Submitted by Blest Ent
about 10 years

Lists within lists - What am I doing wrong?

Oops, try again. Make sure you have at least one unordered list inside your unordered list of profile sections!

<!DOCTYPE html>
<html>
    <head>
        <title>Tracey Ocean</title>
    </head>
    <body><img src="http://i1135.photobucket.com/albums/m624/Blest_Ent/30f5fc01-5acd-4243-9818-f6f34bf2d5e2_zps29b22f17.gif" border="0" alt=" photo 30f5fc01-5acd-4243-9818-f6f34bf2d5e2_zps29b22f17.gif"/>
    <p> Iam a forty something mother currently residing in Greensboro NC</p>
    <ul>Jobs</ul>
       <ol>
    <li>Accountant</li>
    <li> Domestic Engineer</li>
    <li>Servant of God</li>
    <li> Entrepreneur</li>
        <ol>Businesses
        <li>Blest Creations</li>
        <li>Blest Enterprise</li>
        </ol>
    <li>Mother</li>
    <ol>Hobbies</ol>
    <li>Crafts</li>
        <li>Beading</li>
        <li>Sewing</li>
    </body>
</html>

Answer 52a265a2282ae3f1b40009de

53 votes

Permalink

This is a concept that throws everyone off, at first, until we get a closer look at it…

First, let’s discuss the unordered list, <ul></ul>, and the ordered list, <ol></ol>. Both of these elements do not take plain text or any element other than <li></li>. So,

<ul>Jobs</ul>
<!-- and -->
<ol>Businesses

are both invalid HTML. Consider this example:

<ul>
    <li>Red</li>
    <li>Green</li>
    <li>Blue</li>
</ul>

This will print a list on three lines that look something like this:

  • Red
  • Green
  • Blue

and this,

<ol>
    <li>Red</li>
    <li>Green</li>
    <li>Blue</li>
</ol>

will print a numbered list, like so,

  1. Red
  2. Green
  3. Blue

That’s the basic list. Now let’s look at nesting. List item elements, <li></li>, are block elements, and as such may contain other blocks, including UL and OL. The key is to ‘contain’ them in the parent LI.

<ul>
    <li>Jobs
        <ul>
            <li>Accountant</li>
            <li>Domestic Engineer</li>
            <li>Entrepreneur</li>
        </ul>
    </li>
    <li>Businesses
        <ol>
            <li>Blest Creations</li>
            <li>Blest Enterprise</li>
        </ol>
    </li>
</ul>

Study this example and you should be able to repair your markup so it works.

points
Submitted by Roy
about 10 years

32 comments

MogulGraphics about 10 years

this helped me out a lot thank you

Sean K. about 10 years

I tried to do this, but with

Roy about 10 years

CSS depends upon well formed HTML to be effective. Otherwise you’re brute forcing things into position and creating a schmoz. Best to use the built in list tools, and make fine tuning adjustments ‘to tame, rather than tackle’ the list.

snehal about 10 years

thanku

Roy about 10 years

The beauty of lists is that they give us so many hooks. We may not be able to do much with the HTML, but CSS opens a whole world to us, and lists help us explore it.

estrellaetoile about 10 years

Thanks. This did the trick!

13heenakhan about 10 years

Not working Please help

rohan49 about 10 years

It din’t work for me as well:(

ajgal22 almost 10 years

Try changing one of the

    tags into
      , and it will work.

      whxyszl_ almost 10 years

      I change one of the ol tag into ul,it worked.

      Roy over 9 years

      The above is not the answer, but an example. Follow the instructions given in the lesson exercise.

      Ethan Ikpeama over 9 years

      i did exactly this but it was not accepted

      Roy over 9 years

      Be sure one of the nested lists is an UL. I’ve edited the above to show this.

      Roy, this helped me a lot, but shouldn’t the maker of the exercise be made aware that the instructions aren’t really clear? I get it now but “Go nuts with your lists within lists! The only requirement is that you have at least one ordered list(

        ) and one unordered list (
          ).” doesn’t get the point across that you need an ordered list and unordered list nested. I saw this and then reviewed the “Stuck? Get A Hint!” and it did show a unordered list nested in a unordered list, but again, the instructions themselves were not too clear.

      Donaldy over 9 years

      thank you for helping

      LuckyMike over 9 years

      Thanks :D

      Jasmine Stanley over 9 years

      Thank you! This was extremely helpful and I agree with Zach, the instructions weren’t really clear.

      Nurul Hidayati over 9 years

      I try to change for

      Tobias Williams about 9 years

      It’s more that the question is poorly worded, it implies that you need to add a nest ol, not both a nested ol and a nest ul.

      Robert Connelly about 9 years

      Thank you Roy. The coding given didn’t make sense, your’s did.

      supercool12 about 9 years

      I had the same problem!

      hadeel103 about 9 years

      I was stuck on this for ages! Thank you so much you really helped.

      grace mason almost 9 years

      Oh my god thank you i had so much trouble with this

      Matthew Poulton almost 9 years

      Same - thank you very much!! =)

      HalimaJahanMuskan almost 9 years

      thanks a lot!!!!…..

      Sophie Cooper almost 9 years

      Thanks so much!

      zdanielbutler almost 9 years

      Thanks!

      Mr_Programmer007 over 8 years

      Thanks!!

      misnosaginah over 8 years

      thank you for your answer,,, from indonesia

      Thanks!!!

      thank you!

      Carl Laguerre over 8 years

      thanks!

      Answer 5302f80180ff3331a5002157

      2 votes

      Permalink

      Hi, please help. If I make a -ol- inside the -ul- theres the message: “Oops, try again. Make sure you have at least one unordered list inside your unordered list of profile sections! “

      OK, so I did that (-ul- inside -ul-) and the message now “Oops, try again. Make sure you have at least one ordered list inside your unordered list of profile sections! “ … !??? So how can I solve the problem?

      points
      Submitted by Erhard
      about 10 years

      4 comments

      Roy about 10 years

      The only valid direct children for UL or OL are LI. Study the above example. Notice that the inner list is wholly contained in one LI? The LI is the parent of the nested list.

      Jamie about 10 years

      Finally figure it out. Make an ordered list for your “interests” then create and unordered list for you “jobs”. I guess it wants you to create one of both. Kind of confusing.

      Tiffany Katherine Weir almost 10 years

      This is exactly it, I had everything right but until I added both a OL and an UL it didn’t work.

      Connie over 9 years

      Until I did what Erhard did I couldn’t get rid of that message either. Maybe something is wrong beyond our control. I think so. I need to move forward and trying figure out why it doesn’t work as it should is beyond my expertise.

      Answer 5511ea4a95e378ded50004bc

      2 votes

      Permalink

      It’s worse than any comments so far. The instructions ask for one thing but the auto-grader looks for something different. So even working code that follows the instructions doesn’t pass.

      The instructions say: “Go nuts with your lists within lists! The only requirement is that you have at least one ordered list(

        ) and one unordered list (
          ).”

      The error says: “Oops, try again. Make sure you have at least one unordered list inside your unordered list of profile sections!”

      I hope someone from code academy is watching!

      points
      Submitted by MTCA
      almost 9 years

      Answer 53bee01980ff339493000087

      1 vote

      Permalink

      This worked for me, ugh!!

      You have to have one ol with one ul inside it. The tricky part is, you have to have one ul with both and ol and an ul inside it.

      points
      Submitted by Phoebe Sanna
      over 9 years

      Answer 5489a9cd9113cb594d00229b

      1 vote

      Permalink

      Its asking for an unordered inside an unordered. I fell pray to the silly jump backwards in teaching also. I was working in ordered lists, then all of a sudden they ask for another unordered list again.

      There is often rather verbose errors, you sometimes have to read them a few times to follow, they are poorly implemented.

      So

      <ul>
          <li>Outer Unordered
              <ul>
                 <li>Inner Unordered</li>
              </ul>
          </li>
      <li> 
          <ol>
             <li>Inner Ordered</li>
         </ol>
      </li>
      </ul>
      
      points
      Submitted by Stephen Davies
      about 9 years

      Answer 535a6ca052f8630acd002bc9

      0 votes

      Permalink

      Try to read the error warning carefully. This code should solve the problem:

           //creating unordered list - this will wrap all of sub-unordered list and sub-ordered list 
           <ul>
                 //creating sub- unordered list
              <li>Item 1 
                  <ul>
                      <li>sub item 1.1</li>
                      <li>sub item 1.2</li>
                   </ul>
              </li>
                 //creating sub-ordered list
              <li>Item 2
                  <ol>
                      <li>sub item 2.1</li>
                  </ol>
              </li>
          </ul>
      
      points
      Submitted by dothewhatnot
      almost 10 years