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 Include External CSS

Posted by Grant Sebastian
Grant Sebastian
Courses Plus Student 981 Points

My pictures will not show up on preview but when I click on them it takes me to another site and it shows the picture 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Grant Sebastian | Designer</title>
    <link rel="stylesheet" href="css/normalize.css">
  </head>
  <body>
    <header>
      <a href="index.html">
        <h1>Grant Sebastian</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/nubmers-01.jpg" alt="">
            <p>Fun with numbers</p>
          </a>
        </li>
        <li>
          <a href="img/numbers-02.jpg">
            <img src="img/nubmers-02.jpg" alt="">
            <p>Fun with numbers</p>
          </a>
        </li>
        <li>
          <a href="img/numbers-06.jpg">
            <img src="img/nubmers-06.jpg" alt="">
            <p>Fun with numbers</p>
          </a>
        </li>
        <li>
          <a href="img/numbers-09.jpg">
            <img src="img/nubmers-09.jpg" alt="">
            <p>Fun with numbers</p>
          </a>
        </li>
        <li>
          <a href="img/numbers-012.jpg">
            <img src="img/nubmers-012.jpg" alt="">
            <p>Fun with numbers</p>
          </a>  
        </li>
      </ul>
    </section>
    <footer>
      <a href="http://twitter.com"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a>
      <a href="http://facebook.com/sebas31"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>
      <p>&copy; 2014 Grant Sebastian</p>
    </footer>
  </body>
</html>
Grant Sebastian
Grant Sebastian
Courses Plus Student 981 Points

'''<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Grant Sebastian | Designer</title> <link rel="stylesheet" href="css/normalize.css"> </head> <body> <header> <a href="index.html"> <h1>Grant Sebastian</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/nubmers-01.jpg" alt=""> <p>Fun with numbers</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/nubmers-02.jpg" alt=""> <p>Fun with numbers</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/nubmers-06.jpg" alt=""> <p>Fun with numbers</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/nubmers-09.jpg" alt=""> <p>Fun with numbers</p> </a> </li> <li> <a href="img/numbers-012.jpg"> <img src="img/nubmers-012.jpg" alt=""> <p>Fun with numbers</p> </a>
</li> </ul> </section> <footer> <a href="http://twitter.com"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a> <a href="http://facebook.com/sebas31"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a> <p>Ā© 2014 Grant Sebastian</p> </footer> </body> </html>'''

Joshua Holland
Joshua Holland
2,865 Points
Joshua Holland
Joshua Holland
2,865 Points

What do you see where your picture should be?

It sounds like you might have the code for your link but did you add your src code for the actual image? To have an image and a link you need to have 2 codes. the href code is for your link and the src code is for the image.

If you could copy and paste the code in question that would be most helpful. It looks like you tried but I think you put 3 's and not tildas before the code. it's the ` button to the left of #1 on your keyboard.

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Joshua Holland ,

I fixed the code formatting. You're on the right track with the answer.

Grant Sebastian
Grant Sebastian
Courses Plus Student 981 Points

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Grant Sebastian | Designer</title> <link rel="stylesheet" href="css/normalize.css"> </head> <body> <header> <a href="index.html"> <h1>Grant Sebastian</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/nubmers-01.jpg" alt=""> <p>Fun with numbers</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/nubmers-02.jpg" alt=""> <p>Fun with numbers</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/nubmers-06.jpg" alt=""> <p>Fun with numbers</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/nubmers-09.jpg" alt=""> <p>Fun with numbers</p> </a> </li> <li> <a href="img/numbers-012.jpg"> <img src="img/nubmers-012.jpg" alt=""> <p>Fun with numbers</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a> <a href="http://facebook.com/sebas31"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a> <p>&copy; 2014 Grant Sebastian</p> </footer> </body> </html>

1 Answer

Joshua Holland
Joshua Holland
2,865 Points
Joshua Holland
Joshua Holland
2,865 Points

Looks like it might be a simple typo causing all your trouble. Look at your src codes. "numbers" is misspelled. Try changing that and I think you might have your solution.

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Grant Sebastian ,

Have you fixed the typo yet that Joshua has mentioned here?