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

Devi Codron
PLUS
Devi Codron
Courses Plus Student 1,176 Points
Posted by Devi Codron
Devi Codron
Courses Plus Student 1,176 Points

How do I place the image tag, and where?

I missed a video, possibly skipped something and gone to the next one, placing images. Now challenge task: inside the three new list items, add the following images from inside the img folder: "numbers-01.jpg", .. . Leave the alt attributes blank, and don't add any captions or links. just images.

I can't see where, how to change it when I don't place alt attributes jet and captions or links. see my code. How can I review the videos from my previews steps?

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="">
           <p></p>
          </a>
        </li>
        <li>
          <a href="img/numbers-02.jpg">
           <img src="img/numbers-02.jpg" alt="">
            <p></p>
          </a>
        </li>
        <li>
          <a href="img/numbers-03.jpg">
           <img src="img/numbers-03.jpg" alt="">
            <p></p>
          </a>  
        </li> 
      </ul>
    </section>
    <footer>
      <p>&copy; 2013 Nick Pettit.</p>
    </footer>
  </body>
</html>

4 Answers

John Steer-Fowler
PLUS
John Steer-Fowler
Courses Plus Student 11,734 Points
John Steer-Fowler
John Steer-Fowler
Courses Plus Student 11,734 Points

Hi Devi,

You need need to just add the image, you do not need the link ('a' tag).

Try something like this.

        <li>
          <img src="img/numbers-01.jpg" alt="">
        </li>

Now try the same for the other two images.

Devi Codron
Devi Codron
Courses Plus Student 1,176 Points
Devi Codron
Devi Codron
Courses Plus Student 1,176 Points

Ok I tried that too now this is how it looks , and I still can't true the challenge, keeps saying place the image tag that displays "img/numbers-01.jpg"

 <ul>
      <li>
        <img src="img/numbers-01.jpg" alt=""> 
      </li>
      <li>
        <img src="img/numbers-02.jpg" alt=""> 
      </li>
      <li>
        <img src="img/numbers-03.jpg" alt=""> 
      </li>
 </ul>
John Steer-Fowler
PLUS
John Steer-Fowler
Courses Plus Student 11,734 Points
John Steer-Fowler
John Steer-Fowler
Courses Plus Student 11,734 Points

Hi again Devi,

You have it right. But it's not asking you for number 03, it's asking you for number 06

Hope this helps

Devi Codron
Devi Codron
Courses Plus Student 1,176 Points
Devi Codron
Devi Codron
Courses Plus Student 1,176 Points

Alright thanks, that was the problem.. I must read the little things over, I will have a lot of these moments i guess.

Thanks a lot again!

John Steer-Fowler
John Steer-Fowler
Courses Plus Student 11,734 Points
John Steer-Fowler
John Steer-Fowler
Courses Plus Student 11,734 Points

It's important to read everything carefully as it helps you retain information and build knowledge better

Tiffany McAllister
Tiffany McAllister
25,806 Points
Tiffany McAllister
Tiffany McAllister
25,806 Points

If you go to the course page here http://teamtreehouse.com/library/how-to-make-a-website

You should be able to see which steps and videos you have completed. The videos you have completed will have a green tick icon next to them.

Devi Codron
Devi Codron
Courses Plus Student 1,176 Points
Devi Codron
Devi Codron
Courses Plus Student 1,176 Points

Thanks. Anyway I can't get true the challenge. And I reviewed the videos but I still got stuck here.

Now challenge task: inside the three new list items, add the following images from inside the img folder: "numbers-01.jpg", .. . Leave the alt attributes blank, and don't add any captions or links. just images.

I have to place the image tag that displays "img/numbers-01.jpg"

What am i doing wrong?

<section> <ul> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> </a> </li>

Mustafa Başaran
Mustafa Başaran
28,046 Points
Mustafa Başaran
Mustafa Başaran
28,046 Points

Dear Devi,

This exercise is asking you to create an unordered list <ul> and you are required to place those three images within list items <li> via their folder location and file names. That is all what is necessary for this challenge. Please do not bother wrapping the list items -and images- in links <a href> </a>.. That would result in an incorrect answer. In the course video that was however the case because Nick Petit wanted to show that it was possible to create links with images.

Below is the passing answer for this challenge. Step 1 and 2 are combined, of course.

I hope that this helps.

Best regards, Mustafa

<section>
      <ul>
        <li><img src="img/numbers-01.jpg" alt=""></li>
        <li><img src="img/numbers-02.jpg" alt=""></li>
        <li><img src="img/numbers-06.jpg" alt=""></li>
      </ul>
</section>
Devi Codron
Devi Codron
Courses Plus Student 1,176 Points
Devi Codron
Devi Codron
Courses Plus Student 1,176 Points

Thanks Mustafa I appreciate you're clarifying the challenges.

Greetings Devi