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

Daniel Haasenritter
PLUS
Daniel Haasenritter
Courses Plus Student 3,463 Points
Posted by Daniel Haasenritter
Daniel Haasenritter
Courses Plus Student 3,463 Points

Not sure how I got this wrong

I thought I followed all the steps correctly. I reproduced what is already in my index.html file. I just copied it. Stroke for stroke. Then, at each step along the way, I previewed it. It looks pretty good to me. I got the images. Not sure why I am getting this message.

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 src="img/numbers-01.jpg" alt="">
          </a>
        </li>
        <li>
          <a href="img/numbers-02.jpg">
            <img src="img/numbers-02.jpg" alt="">
          </a>
        </li>
        <li>
        <a href="img/numbers-06.jpg">
          <img src="img/numbers-06.jpg" alt="">
          </a>
        </li>
      </ul>

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

1 Answer

Dan Sabin
PLUS
Dan Sabin
Courses Plus Student 1,909 Points
Dan Sabin
Dan Sabin
Courses Plus Student 1,909 Points

Nick what error message are you seeing?

Also looking at the code I'm assuming maybe the images aren't working locally. Given the way it's written if I were running this on my computer I'd have the following folder structure:

  • index.html
  • img/
    • numbers-01.jpg
    • numbers-02.jpg
    • numbers-06.jpg

The images are relative to the index.html so they should be inside a folder that is next to the index.html.

The images may be in the same directory as index.html like the following:

  • index.html
  • numbers-01.jpg
  • numbers-02.jpg
  • numbers-06.jpg

If that's the case then the img tags should be:

<img src="numbers-06.jpg" alt="">

Finally if you're working on your own with images online you can also do the following. If for example you had some images online at http://imgur.com/nRkDA3V then the tag would be:

<img src="http://imgur.com/nRkDA3V" alt="">

UPDATE

After running the challenge i noticed you're putting your images inside <a> tags. This isn't necessary for the challenge. Simply remove the <a> tags and set the src to "numbers-01.jpg" instead of "img/numbers-01.jpg".