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

Posted by JASON TORRES
JASON TORRES
1,573 Points

Add a nested ordered list to the "Shapes" list item. Need help.

NEVERMIND FIGURED IT OUT. =]

lina Hernandez
lina Hernandez
4,583 Points
lina Hernandez
lina Hernandez
4,583 Points

Im on the same question

Do we need to add <ol> ,<Li> item one</li> this this list maybe the question is the part that makes no sense

16 Answers

lina Hernandez
lina Hernandez
4,583 Points
lina Hernandez
lina Hernandez
4,583 Points

<!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 <li> one</li> <li>two</li> <li> Colors </li> </ul> </ul>

</body> </html>

I still can't get pass this question... not sure whats the right code for this one

lina Hernandez
lina Hernandez
4,583 Points
lina Hernandez
lina Hernandez
4,583 Points

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

this should work : <ul> <li>Shapes <ol>Square</ol> <ol>Circle</ol> </li> <li>Colors</li> </ul>

But of course does not, anyone has a Clue was wrong w this ?

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Simon Lehmann - I've removed your code, because here on the Treehouse forum we usually tree to give hints instead of just giving answers. The important thing to remember is the goal of this forum is not to get someone past a code challenge but instead to help the user learn how to solve their own issues.

jamiemarsden2
jamiemarsden2
2,935 Points
jamiemarsden2
jamiemarsden2
2,935 Points

Your close list item tag for your primary list must be after the close of your nested list :- 

   <ul>
      <li>Shapes
       <ol>
           <li></li>
        </ol></li>
       <li>Colors</li>
  </ul>
david thompson
seal-mask
.a{fill-rule:evenodd;}techdegree
david thompson
Front End Web Development Techdegree Student 6,088 Points
david thompson
.a{fill-rule:evenodd;}techdegree
david thompson
Front End Web Development Techdegree Student 6,088 Points

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

<!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>

What am i doing wrong as i keep getting an error.

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

@Jason - It would be more helpful on the forum to leave your original post and a response to how you figured it out.

As the entire purpose of the forum if for Treehouse users to provide value to each other, otherwise you might as just email support.

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

@David -

Keep in mind that a nested list should go between the <li> and </li> tags to be valid HTML.

Here's an example:

<ul>
    <li><a href="#">Milk</a>
       <ul>
           <li><a href="#">Goat</a></li>
           <li><a href="#">Cow</a></li>
       </ul>
    </li>
    <li><a href="#">Eggs</a>
       <ul>
           <li><a href="#">Free-range</a></li>
           <li><a href="#">Other</a></li>
       </ul>
    </li>
    <li><a href="#">Cheese</a>
       <ul>
           <li><a href="#">Smelly</a></li>
           <li><a href="#">Extra smelly</a></li>
       </ul>
    </li>
</ul>

source: http://css.maxdesign.com.au/listutorial/sub01.htm

Gerald Quinones
Gerald Quinones
2,953 Points
Gerald Quinones
Gerald Quinones
2,953 Points

This is frustrating me, I know this code is right. Code is nested in order inside of shapes:

<ul> <li>Shapes</li> <ol> <li>nested ordered list inside of shapes</li> <li> second item nested inside of shapes</li> </ol> <li>Colors</li> </ul>

Christopher Navock
Christopher Navock
1,991 Points
Christopher Navock
Christopher Navock
1,991 Points

@James "Keep in mind that a nested list should go between the <li> and </li> tags to be valid HTML"

Great Help! This comment totally unlocked the challenge for me. My nested list WASN'T inside the <li></li> tags! Boom done. Thank you!

Gerald Quinones
Gerald Quinones
2,953 Points
Gerald Quinones
Gerald Quinones
2,953 Points

(<ul> <li>Shapes</li> <ol><li>this is nested in order</li></ol> <li>Colors</li> </ul>)

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Gerald Quinones -

I noticed a small issue with your code, my suggestion to you is to try this approach instead ...

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.

<ol>
  <li>Walk the dog</li>
  <li>Fold laundry</li>
  <li>Go to the grocery and buy:
    <ul>
      <li>Milk</li>
      <li>Bread</li>
      <li>Cheese</li>
    </ul>
  </li>
  <li>Mow the lawn</li>
  <li>Make dinner</li>
</ol>

source: http://learn.shayhowe.com/html-css/ordered-unordered-definition-lists#nested-lists

Arshkit Dullat
Arshkit Dullat
1,525 Points
Arshkit Dullat
Arshkit Dullat
1,525 Points

The best way to figure this out is to go and review the lesson on ordered and unordered lists while also reviewing the associated project files (.zip project files for each lesson are available). Atleast, thats how I was able to figure this one out. There is a nice subtlety in syntax for nested lists that one needs to capture and if you are able to catch that you'll be through with the challenge.

Jose Andrade-Sinning
seal-mask
.a{fill-rule:evenodd;}techdegree
Jose Andrade-Sinning
Python Web Development Techdegree Student 12,676 Points
Jose Andrade-Sinning
.a{fill-rule:evenodd;}techdegree
Jose Andrade-Sinning
Python Web Development Techdegree Student 12,676 Points

I'm still a bit confused even though I figured it out. Why is it that the nested list must be in between <li> and </li> if placing nested ordered list outside visually gives you the same result.

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

The reason you have to do it is because the HTML spec says the only valid child of <ul> element is an <li>.

If you put 

<ul>
   <li>Shapes</li>
    <ol><li>this is nested in order</li></ol>
   <li>Colors</li>
   </ul>

into the W3C's HTML validator it will flag an error.

But why does it look correctly anyway, because browsers are extremely forgiving. You will never get an error message on an HTML page saying invalid markup or something similar the browser will always give its best effort.

further reading

http://rebuildingtheweb.com/en/html5-make-web-more-invalid/ http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/#Browsers_error_tolerance

Pirvan Marian
Pirvan Marian
14,609 Points
Pirvan Marian
Pirvan Marian
14,609 Points

Same error i have :
Add the items "Square" and "Circle" to the list nested under "Shapes".

I write : <ol> <li>Stop</li> <li>Drop</li> <li>Roll</li> </ol>

<ul> <li>Shapes</li> <ul> <li>Square</li> <li>circle</li> </ul>

</ul>

What is wrong ?

Arshkit Dullat
Arshkit Dullat
1,525 Points
Arshkit Dullat
Arshkit Dullat
1,525 Points

Pirvan: Review the associated project files (.zip project files for each lesson are available) to compare with what you currently have and how it is given there in that example - you should see a difference in the syntax.

Pirvan Marian
Pirvan Marian
14,609 Points
Pirvan Marian
Pirvan Marian
14,609 Points

i donwload it, .. not work...

lina Hernandez
lina Hernandez
4,583 Points
lina Hernandez
lina Hernandez
4,583 Points

here the right answer by copy and pasting one of the answers from this Forum, problem with this questions is missing the Words "Shape" and "Clicles" in order to answer correctly
<ul> <li>Shapes <ol>Square</ol> <ol>Circle</ol> </li> <li>Colors</li> </ul>