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 Image Gallery Content

Posted by Tori Coker
Tori Coker
5,735 Points

When I click on the image, it does not take me to the img link, so that i can view it. Code seems right. Help!

I have added the <a href> to the image source. But when i preview my page, all the images are there. If i click on the to see them independently, i get a 404 error message as if i have a broken link. This is keeping any new changes from happening. Help!

!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Tori Coker | Photographer</title> </head> <body> <header> <a href="index.html"> <h1>Tori Coker</h1> <h2>Photographer</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> <section>

<ul> <li> <a href="img/edit7.jpg"> <img src="img/edit7.jpg" alt=""> <p>Mother and fawn.</p> </a> </li>

<li> <a href="img/edit11.jpg"> <img src="img/edit11.jpg" alt=""> <p>Upward View.</p> </a> </li>

<li> <a href="img/flower 2 edit.jpg"> <img src="img/flower 2 edit.jpg" alt=""> <p>White flowers in the Morning.</p> </a> </li>

<li> <a href="img/lake bed edit.jpg"> <img src="img/lake bed edit.jpg" alt=""> <p>Even Underfoot.</p> </a> </li>

<li> <a href="img/blue moon.jpg"> <img src="img/blue moon.jpg" alt=""> <p>Blue Moon Night</p> </a> </li>

<li> <a href="img/butterfly.jpg"> <img src="img/butterfly.jpg" alt=""> <p>Landing for a Moment</p> </a> </li> </ul>

</section> <footer> <p>© 2015 Tori Coker.</p> </footer> </header> </body> </html>

elk6
elk6
22,916 Points

Hi Tori,

Can you post your code so we can see what is going on?

Thanks!

Hammad Ahmed
.a{fill-rule:evenodd;}techdegree
Hammad Ahmed
Full Stack JavaScript Techdegree Student 11,910 Points

Can you elaborate it a bit more by adding the code?

Devon Deason
Devon Deason
7,061 Points
Devon Deason
Devon Deason
7,061 Points

Noticed you added my suggestion when you posted your next question. Any chance I can get a vote for best answer?

2 Answers

Devon Deason
Devon Deason
7,061 Points
Devon Deason
Devon Deason
7,061 Points

From what I can tell, your list items look incomplete to me. They should all be almost identical to the first anchor element you provide. For example...

<li>
    <a href="img/edit11.jpg">
        <img src="img/edit11.jpg" alt="">
        <p>Upward View.</p>
    </a>
</li>

See if that gets you to where you want to be.

Erion Pali
seal-mask
.a{fill-rule:evenodd;}techdegree
Erion Pali
Full Stack JavaScript Techdegree Student 16,964 Points
Erion Pali
.a{fill-rule:evenodd;}techdegree
Erion Pali
Full Stack JavaScript Techdegree Student 16,964 Points

Looks like you don't have opening <a> tags for each <li> you only put it for the first one and only put closing </a> tags on the rest.