Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

I need help! I can't answer a challenge task question in the HTML List section on nested items.

Please Help Me! No matter what code I've tried I can't complete the last question for the HTML List "Challenge Task". It's actually the last question and I'll have completed all of Deep Dives HTML section.

The question is:

Add the items "Square" and "Circle" to the list nested under "Shapes".

The following is the (correct) code I have created with the first 5 questions.

<!DOCTYPE html> <html> <head> <h1>HTML Lists Challenge</h1>

<!-- Write your code below --> <ol> <li>Stop</li> <li>Drop</li> <li>Roll</li> </ol>

<ul> <li>Shapes <ol>Square</ol> <ol>Circle</ol> </li> <li>Colors</li> </ul>

</body> </html>

Please Help Me! I've been working on this one question all weekend long. Where is my mind?

7 Answers

Building a nested list is fairly simple. Determine where a nested list should appear, and rather than closing a list item, begin a new list. Once the nested list is complete, close the wrapping list item and continue on with the original list.

<!DOCTYPE html>

<html>
<head>
    <title>HTML Lists Challenge</title>
</head>

<body>
    <h1>HTML Lists Challenge</h1><!-- Write your code below -->

    <ol>
        <li>Stop</li>

        <li>Drop</li>

        <li>Roll</li>
    </ol>

    <ul>
        <li>Shapes

            <ol>
                <li>Square</li>

                <li>Circle</li>
            </ol>
        </li>

        <li>Colors</li>
    </ul>
</body>
</html>

If you are still confused I strongly suggest that you re-watch the previous videos then study this example code that I wrote above to fully understand how nesting works and how to use it properly, because it will be for everyday use.

Hope this helps!

I was hoping to let him figure it out on his own as we aren't suppose to just blurt out the answer :D.

I figured that since he spent all weekend on it he could use a break. but yes I agree on a normal basis it's not good to do

True, it's Monday tomorrow! Sunday is when we worry that it's almost Monday - You have a point. Well - I hope it goes well for him :D!

lol. me to! :D

Elliott Frazier - Personally I'm conflicted about leaving this code here.

In a few months when another user is working through this question someone "well-meaning: may link to this thread instead of trying to help the user understand how list work in HTML.

Thoughts?

as I said above, I did this out of remorse taking into consideration that he spent all weekend on it without figuring it out. I also took into consideration of what you said and I completely agree, so I added a note to the bottom of the example code informing the importance of nesting. feel free to attach a thread to that post going into more detail about nesting if you wish. :)

Elliott Frazier +1- for having compassion for someone struggling on a topic for a few days.

<!DOCTYPE html> <html> <head> <h1>HTML Lists Challenge</h1>

<!-- Write your code below --> <ol> <li>Stop</li> <li>Drop</li> <li>Roll</li> </ol>

<ul> <li>Shapes <ol>Square</ol> <ol>Circle</ol> </li> <li>Colors</li> </ul> </body> </html>

Can you display your code by tabing in each line of your code.

<!DOCTYPE html> </html> <head> <title>HTML Lists Challenge</title> </head> <body>

<h1>HTML Lists Challenge</h1>

<!-- Write your code below --> <ol> <li>Stop</li> <li>Drop</li> <li>Roll</li> </ol>

<ul> <li>Shapes <ol>Square</ol> <ol>Circle</ol> </li> <li>Colors</li> </ul> </body> </html>

<!DOCTYPE html> </html> <head> <title>HTML Lists Challenge</title> </head> <body>

<h1>HTML Lists Challenge</h1>

<!-- Write your code below --> <ol> <li>Stop</li> <li>Drop</li> <li>Roll</li> </ol>

<ul> <li>Shapes <ol>Square</ol> <ol>Circle</ol> </li> <li>Colors</li> </ul> </body> </html>

<!DOCTYPE html> </html> <head> <title>HTML Lists Challenge</title> </head> <body>

<h1>HTML Lists Challenge</h1>

<!-- Write your code below --> <ol> <li>Stop</li> <li>Drop</li> <li>Roll</li> </ol>

<ul> <li>Shapes <ol>Square</ol> <ol>Circle</ol> </li> <li>Colors</li> </ul> </body> </html>

I believe you have an existing list right? Don't remember if it makes you make an unordered or ordered list, then makes you create three li's - Well, from what I recall - it makes you create a nested list within one of those named shapes - so you need three with the names of the shapes they give you. They are teaching you about nesting if I recall correctly.

I have an existing list with two <ul> words: Shape and Color. It is asking me to nest the words Square and Circle under the word "Shape". For some reason I'm not coding it correctly and now I'm stuck.

Remember that you have to create a NEW list - Not sure if it's asking you for an ordered list as I cannot see the exercise anymore. If you need anymore help add me on skype => lloanalas@live.com I'm on like ALL the time ^-^.

Could you get the link on how to display code?

Thank you both for all your help! I felt like a defeatist.

If either of you live in Austin I would like to buy you both a beer! And yes I don't care for Mondays either.

My email is mkendziora3@gmail.com

Thanks, Mars

Thank you both for all your help! I felt like a defeatist.

If either of you live in Austin I would like to buy you both a beer! And yes I don't care for Mondays either.

My email is mkendziora3@gmail.com

Thanks, Mars

No problem, glad to help!