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
Eric Wullenbaecker
1,715 PointsMy images do not show properly
Hello,
my images are clickable and linked and they also open up once you click on them. However, they are not visible and are just shown as small icons.
How can I fix this?
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Eric Wullenbaecker | Growth Hacker</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> <a href="index.html"> <h1>Eric Wullenbaecker</h1> <h2>Growth Hacker</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> <div id="wrapper"> <section> <ul> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers–01.jpg" alt=""> <p>Experimentation with Color and Texture.</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/numbers–02.jpg" alt=""> <p>Playing with blending modes in Photoshop.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers–06.jpg" alt=""> <p>Trying to create an 80's style of glows.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers–09.jpg" alt=""> <p>Drips created using Photoshop brushes.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers–12.jpg" alt=""> <p>Creating shapes using repetition.</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com/ewullenbaecker"><img src="img/twitter–wrap.png" alt="Twitter Logo"></a> <a href="http://facebook.com/steve.tabernackle"><img src="img/facebook–wrap.png" alt="Facebook Logo"></a> <p>© 2014 Eric Wullenbaecker</p> </footer> </div> </body> </html>
5 Answers
Jacob Miller
12,466 PointsSound's like you are not linking to them correctly. Make sure you add the path to the file in the src value. If they are within a folder, make sure you specify that from the html. For example <img src="folder/photo.jpg" />
Eric Wullenbaecker
1,715 PointsThanks Jacob. I am linking them correctly though:
<img src="img/numbers-01.jpg" alt="">
```
The index.html file is also not in the pics folder and the folder is called img. I tried to reupload and do it again, but it won't work.
Here all my code:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Eric Wullenbaecker | Growth Hacker</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> <a href="index.html"> <h1>Eric Wullenbaecker</h1> <h2>Growth Hacker</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> <div id="wrapper"> <section> <ul> <li> <a href="numbers-01.jpg"> <img src="img/numbers–01.jpg" alt=""> <p>Experimentation with Color and Texture.</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/numbers–02.jpg" alt=""> <p>Playing with blending modes in Photoshop.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers–06.jpg" alt=""> <p>Trying to create an 80's style of glows.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers–09.jpg" alt=""> <p>Drips created using Photoshop brushes.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers–12.jpg" alt=""> <p>Creating shapes using repetition.</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com/ewullenbaecker"><img src="img/twitter–wrap.png" alt="Twitter Logo"></a> <a href="http://facebook.com/steve.tabernackle"><img src="img/facebook–wrap.png" alt="Facebook Logo"></a> <p>© 2014 Eric Wullenbaecker</p> </footer> </div> </body> </html>
```
Jacob Miller
12,466 PointsHmm. Can you repost your code please? It didn't get formatted correctly the first time. Check out the video to the right called "Tips for asking questions" and they explain how to get it to show up right. Thanks.
Eric Wullenbaecker
1,715 Pointsdone :).
Eric Wullenbaecker
1,715 PointsHi Jacob, I just updated it.
Eric Wullenbaecker
1,715 PointsHi Jacob, I found it :). It was just visible on your this screen. I used a long [–] instead of a short [-] in the pictures. It now shows up.
Jacob Miller
12,466 PointsCool. Glad you figured it out. :)