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 Add Social Media Links

Posted by Jordan Winters
.a{fill-rule:evenodd;}techdegree
Jordan Winters
Front End Web Development Techdegree Student 10,360 Points

What am I missing?

It tells me to do this:

Inside the <footer> element, add the images facebook-wrap.png and twitter-wrap.png from inside the img folder. Be sure to include an appropriate alternate attribute for each. Don’t link them yet.

It tells me I'm wrong...

Here is my code:

<!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="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> <footer> <a><img src="Facebook-wrap.png" alt="Facebook Logo"></a> <a><img src="Twitter-wrap.png" alt="Twitter Logo"></a> <p>© 2013 Nick Pettit.</p> </footer> </body> </html>

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>
          <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>
    <footer>
      <a><img src="Facebook-wrap.png" alt="Facebook Logo"></a>
      <a><img src="Twitter-wrap.png" alt="Twitter Logo"></a>
      <p>&copy; 2013 Nick Pettit.</p>
    </footer>
  </body>
</html>

2 Answers

Ben Schroeder
Ben Schroeder
22,818 Points
Ben Schroeder
Ben Schroeder
22,818 Points

A few things:

  • The challenge says "Don't link them yet," which really means they don't want you to use an <a> tag yet.
  • The images themselves are in the "img" directory, so you need to change the image URL to include that directory.
  • As far as this particular challenge is concerned, the image file names are case-sensitive, so they must be lowercase.
<footer>
  <img src="img/facebook-wrap.png" alt="Facebook Logo">
  <img src="img/twitter-wrap.png" alt="Twitter Logo">
  <p>&copy; 2013 Nick Pettit.</p>
</footer>
Jordan Winters
.a{fill-rule:evenodd;}techdegree
Jordan Winters
Front End Web Development Techdegree Student 10,360 Points

Awesome. That explains a lot. Thank you!

Mike Wagner
Mike Wagner
23,559 Points
Mike Wagner
Mike Wagner
23,559 Points

The first issue i see is that the image names are capitalized when it shows them as lowercase in the challenge task. it also says you need to link to the images inside the img folder,l but you are linking directly to the image.

Jordan Winters
.a{fill-rule:evenodd;}techdegree
Jordan Winters
Front End Web Development Techdegree Student 10,360 Points

That was really helpful. Thank you!