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

Posted by Dru M. Pulliam
Dru M. Pulliam
Courses Plus Student 361 Points

Add Image Gallery Content: Stuck; 2nd task of quiz

Hello Community,

I am attempting to add the code that will enable three images to appear on the web site. I need to set up "img/numbers-01.jpg", 02, and 06.

I have been working the problem for a while; I don't know if my computer has a glitch or if it's the Treehouse program. This I mention cause my computer was acting up and something may have been missed cleaning wise.

I believe the answer is:

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

same above code; 01 becomes 02 and 02 becomes 06 with the final ending as such:

  </a>
   </li>
 </ul>

<footer> and so forth to its end

The directions stated: include only the image, no captions or comments under each pic. Leave the alt blank which may be the cause to my issue. As you all can see, I added the code line that includes alt="">.

In my thinking, both img/number lines between <li> and</li> (x's 3) are needed because it gives direction to the SE's spiders. I mention this due to being told to leave the alt blank. Leaving the alt blank--if one has; "... alt=""> that to me states that it is blank due to the fact that there are no words between the quotes and there is no specific closing tag.

If leaving the alt blank means not including the line of code, well; how would the code work with out offering it information to tell it to work--not possible, right?

The last time I clicked on the button to see if I got a "bummer" or a "good job", the prompt told me to include the code so that "img/numbers-01.jpg" would be visable--hum!!? I clicked on preview and all the pic's were there??

What am I missing?

Thanks to you all who check my post out and offer me a solution :)

Dru M. Pulliam

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 herf="img/numbers-02.jpg">
            <img src="img/numbers-02.jpg" alt="">
            <p></p>
          </a>
        </li>
        <li>
          <a href="img/numbers-06.jpg">
            <img src="img/numbers-06.jpg" alt="">
            <p></p>
            <a/>
        </li>
      </ul>
    </section>
    <footer>
      <p>&copy; 2013 Nick Pettit.</p>
    </footer>
  </body>
</html>
john larson
john larson
16,594 Points

Maybe it's cause you did MORE than they asked. What I did below passed. And yes, the challenges can be finicky sometimes.

3 Answers

john larson
john larson
16,594 Points 
<!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><img src="numbers-01.jpg" alt=""></li>
        <li><img src="numbers-02.jpg" alt=""></li>
        <li><img src="numbers-06.jpg" alt=""></li>
      </ul>
    </section>
    <footer>
      <p>&copy; 2013 Nick Pettit.</p>
    </footer>
  </body>
</html>
James N
James N
17,864 Points
James N
James N
17,864 Points

man. HTML is a messy language.

Dru M. Pulliam
PLUS
Dru M. Pulliam
Courses Plus Student 361 Points
Dru M. Pulliam
Dru M. Pulliam
Courses Plus Student 361 Points

Less info...that makes sense as I was starting to get to wrapped up in the task (worded nicely)...thank you John, I'll give it a try.

Dru M. Pulliam
PLUS
Dru M. Pulliam
Courses Plus Student 361 Points
Dru M. Pulliam
Dru M. Pulliam
Courses Plus Student 361 Points

And that was the correct answer, thanks again John. The next time I have an issue, I will remember to consider that I may be over thinking.