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 Zarne Dravitzki
Zarne Dravitzki
1,031 Points

Can you please tell me where I am going wrong with this code? I can't spot the error...

Syntax should be: <a href="url">link text>/a>

I can't see where I am going wrong...

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="">

      </ul>
    </section>

    <footer>
          <img src="img/facebook-wrap.png" alt="facebook"/>
      <a href = "http://facebook.com">Visit Our Facebook Page</a>
     <img src="img/twitter-wrap.png" alt="twitter"/>
        <a href = "http://twitter.com">Visit My Twitter Page</a>

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

3 Answers

Jennifer Nordell
seal-mask
STAFF
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher
Jennifer Nordell
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher

Also, your last li element is missing its closing tag.

<li>
          <img src="img/numbers-06.jpg" alt=""> 
</li> <!-- closing tag missing here -->
Haider Ali
.a{fill-rule:evenodd;}techdegree seal-36
Haider Ali
Python Development Techdegree Graduate 24,728 Points

Well spotted!

Jeremy Hill
Jeremy Hill
29,567 Points
Jeremy Hill
Jeremy Hill
29,567 Points

You want the facebook-wrap and the twitter-wrap to be the links to click on so you have to include that in your anchor tags. Here is an example:

a href="http://facebook.com/yourname">img src="img/facebook-wrap.png"></a>

Do the same thing with twitter.

I had to take out a couple tag symbols because my code disappeared with them in place.

Haider Ali
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Haider Ali
Python Development Techdegree Graduate 24,728 Points
Haider Ali
.a{fill-rule:evenodd;}techdegree seal-36
Haider Ali
Python Development Techdegree Graduate 24,728 Points

Hi, the images have to be wrapped in the anchor tags:

<!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="">

      </ul>
    </section>

    <footer>

        <a href = "http://facebook.com">Visit Our Facebook Page
        <img src="img/facebook-wrap.png" alt="facebook"/></a>

        <a href = "http://twitter.com">Visit My Twitter Page
        <img src="img/twitter-wrap.png" alt="twitter"/></a>

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