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 How to Make a Website Creating HTML Content Organize with Unordered Lists

I'm stuck at a question, i don't know whats wrong.

It keeps telling me i'm wrong but i really don't know what i'm doing wrong.

--> "Bummer! Make sure you include an image tag that displays "numbers-01.jpg" ." I don't understand what i need to do.

index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Nick Pettit</title>
  </head>
  <body>
    <header>
      <a href="index.html">
        <h1>Nick Pettit</h1>
        <h2>Designer</h2>
      </a>
      <nav>
        <ul>
          <li><a href="index.html">Portfolio</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>
    <section>
     <ul>
        <li>
          <a href="img/numbers-01.jpg">
            <img scr="img/numbers-01.jpg" alt="">
            <p></p>
          </a>
        </li> 
      <ul>
        <li>
          <a href="img/numbers-02.jpg">
            <img scr="img/numbers-02.jpg" alt="">
            <p></p>
          </a>
        </li>
        <ul>
        <li>
          <a href="img/numbers-06.jpg">
            <img scr="img/numbers-06.jpg" alt="">
            <p></p>
          </a>
        </li>

    </section>
    <footer>
      <p>&copy; 2013 Nick Pettit.</p>
    </footer>
  </body>
</html>

1 Answer

Anjali Pasupathy
Anjali Pasupathy
28,883 Points

You've got a few things to fix in your code. First, you don't need to wrap your images in an anchor element, and you don't need a paragraph element. You should remove these. Second, the attribute that tells the image element where it's getting the image is "src", not "scr". You'll need to change those.

Making these changes is enough to pass the quiz, but your code still has some problems with it.

The code challenge asked you to create an unordered list with three list elements, kind of like the unordered list in the nav element:

<ul>
  <li><!--INSERT LIST ITEM HERE--></li>
  <li><!--INSERT LIST ITEM HERE--></li>
  <li><!--INSERT LIST ITEM HERE--></li>
</ul>

<!--THIS IS A COMMENT. EVERYTHING IN HERE HAS NO EFFECT ON THE CODE.-->

(I put the comment below the unordered list in case you didn't know what a comment in HTML looks like)

By putting in the extra "ul" tag after every "li" element, you're opening up a new unordered list inside of the unordered list you originally created before adding the next list item to the new unordered list. That's why, when you Preview your code (after you've changed "scr" to "src" in the image element), you'll see that the third image is in a sub-bullet of the second image, which is in a sub-bullet of the first image. This is not the format the instructions want you to make; rather, the images should each be in their own bullet, in the same way that each element in the nav element's unordered list is in its own bullet.

One last important thing: you need to close the unordered list using "/ul" after the last list item. HTML is being nice to you and assuming you meant to put every "/ul" right before "/section", which is why you can still see the bullet-point list of images in the Preview. But it's better to learn good syntax now, so you'll be less likely to make a mistake and HTML will be less likely to interpret your mistake the wrong way.

I hope this helps!

Anjali Pasupathy
Anjali Pasupathy
28,883 Points

Nick Pettit I think there's a bug in the way the code challenge determines whether or not you've created an unordered list with three list items: I'm pretty sure the intention was to create a single unordered list, not an unordered list containing an unordered list containing an unordered list, but the above code with the anchor elements removed and with "scr" changed to "src" in the image elements still passes the quiz.

When i change the "scr" to "src" i still can't pass the test. And thx for all the information :)

Anjali Pasupathy
Anjali Pasupathy
28,883 Points

You also need to get rid of the anchors. If you remove the tags with "a href="INSERT URL HERE"" and "/a" from all your li elements, your code should pass.

You're welcome! (: