Learn HTML by Building a Cat Photo App - Step 15

HTML-CSS
1

Hello again,

I am having trouble with knowing where this step wants me to put <a.
Everywhere I put it is is wrong. If I put it within the <img it say’s it needs to have an opening <a. When I put it in the front it say’s I have multiple opening <a and need to delete some. Except it’s the only one there.

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>See more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a> in our gallery.</p>

<!-- User Editable Region -->

<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" href="https://freecatphotoapp.com" alt="A cute orange cat lying on its back." </a>

<!-- User Editable Region -->

    </main>
  </body>
</html>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36

Challenge: Learn HTML by Building a Cat Photo App - Step 15

Link to the challenge:

3

Hello!
I would suggest anchoring the complete img element, including the alt attribute. Do not place the a anchor inside the current img element. It needs to anchor it. Therefore, it needs to be on the outside at both ends. I hope this helps you. Happy coding!

4

I’m not sure why it isn’t showing what I actually have, but I have -
<a href="https://freecatphotoapp.com"> <img src=""https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."</a>

It say’s that I have multiple opening <a> and I need to get rid of the extra’s. When I take the “<” infront of the img away then the picture goes away and becomes a text. I don’t know what I am doing wrong here.

5

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

1 Like
6

I do not see the > that should be at the end of the original img.
As a example
< img src = "abc.cde alt = “xyz”>
Place the anchor outside the < >

1 Like
7

Thank you! I was wondering why it wasn’t showing up.

8

Cody fixed it so it is actually showing my problem.

9

Yes, the Moderators, Leaders and Team Members are the best in this community. I have learned much from them.

11

I think life.blessed was on the money. I dont see a closing > for your img here

1 Like