Learn HTML by Building a Cat Photo App - Step 15

HTML-CSS
1

I don’t understand how to make the image into a link. The instructions say to add an a anchor element. what value and what attributes should the anchor element have in order to make the image into a link?
Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a></p>
<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">
    </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/108.0.0.0 Safari/537.36

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

Link to the challenge:

2

Use https://freecatphotoapp.com as the anchor’s href attribute value.

This is the only attribute you need to add to your new anchor element.

3

I used a as the anchor, followed by href= and the link, then the image source and link, and closing anchor, but it’s still wrong. Is there something I’m leaving out or misunderstanding?

4

Please provide the code where you added an anchor element. Thanks

5

<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>

6

Sorry I’m not sure how to post the code properly :confused:

7

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 (').

8

This is an invalid opening anchor tag - every tag must have < and >

10

I’m sorry to be annoying and ask so many questions, but I can’t figure out how to make a backtick, I’ve tried googling it and none of the answers work.

11

I would use this here.

12

You added a > here, but it is in the wrong place. The > needs to come after all of the attributes that are part of the opening tag.

Here, the href attribute needs to be part of the opening anchor tag.

13

It worked thank you so much for your help!

1 Like