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!
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
Sami Damico
Courses Plus Student 664 PointsSome Images Not Showing In Preview!-PLEASE HELP!
Hello Everybody! I am new to coding and I have just started building a website. I have been following the videos EXACTLY. When I got to the part where we post pictures, all of them came up in preview except one. My code is as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Zane D'Amico | Musician</title>
</head>
<body>
<header>
<a href="index.html">
<h1>Zane D'Amico</h1>
<h2>Musician</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/IMG_0773.JPG">
<img src="img/IMG_0773.JPG" alt="">
<p>My Family.</p>
</a>
</li>
<li>
<a href="img/IMG_0774.JPG">
<img src="img/IMG_0774.JPG" alt="">
<p>My Dog.</p>
</a>
</li>
<li>
<a href="img/IMG_0776.JPG">
<img src="img/IMG_0776.JPG" alt="">
<p>Favorite Snack.</p>
</a>
</li>
<li>
<a href="img/numbers-9.jpg">
<img src="img/numbers-9.jpg" alt="">
<p>This looks cool</p>
</a>
</li>
<li>
<a href="img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt="">
<p>This also looks cool.</p>
</a>
</li>
</ul>
</section>
<footer>
<p>Ā© 2014 Zane D'Amico.</p>
</footer>
</body>
</html>
As you can see there are 5 images. The 4th one (img/numbers-9.jpg) shows up in preview as what appears to be a mountain. Is there a misspelling? Wrong punctuation? Wrong coding? Please let me know below...PLEASE! And yes I named the destination folder img and that picture is in there... they all are. Again, please let me know what is wrong!
3 Answers
stevencooper
5,755 PointsYou need to use the reverse apostrophe key, 3 of them (lowercase of the ~ key, upper left of keyboard), at the beginning & end of your code to have it show up. It's explained in the markdown cheatsheet just under the comment section. Follow the instructions to post your code, I'll be happy to look at it and try to help.
Sami Damico
Courses Plus Student 664 PointsOh my! Ive been at this for 2 hours trying to figure out what i did wrong and i know now. In the img file it was named 09 and I just put 9 in the code! Thanks for helping anyway! Worst mistake ever:)
Sami Damico
Courses Plus Student 664 PointsSorry for that! Thanks for replying so fast!
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Zane D'Amico | Musician</title>
</head>
<body>
<header>
<a href="index.html">
<h1>Zane D'Amico</h1>
<h2>Musician</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/IMG_0773.JPG">
<img src="img/IMG_0773.JPG" alt="">
<p>My Family.</p>
</a>
</li>
<li>
<a href="img/IMG_0774.JPG">
<img src="img/IMG_0774.JPG" alt="">
<p>My Dog.</p>
</a>
</li>
<li>
<a href="img/IMG_0776.JPG">
<img src="img/IMG_0776.JPG" alt="">
<p>Favorite Snack.</p>
</a>
</li>
<li>
<a href="img/numbers-9.jpg">
<img src="img/numbers-9.jpg" alt="">
<p>This looks cool</p>
</a>
</li>
<li>
<a href="img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt="">
<p>This also looks cool.</p>
</a>
</li>
</ul>
</section>
<footer>
<p>© 2014 Zane D'Amico.</p>
</footer>
</body>
</html>