How to make cat photo a link

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
How will i add the anchor text cat photos to the anchor element. This will become the link’s text.

  **Your code so far**

<html>
<body>
  <h1>CatPhotoApp</h1>
  <main>
    <h2>Cat Photos</h2>
    <!-- TODO: Add link to cat photos -->
    <p>Click here to view more cat photos.</p>
    <a href=cat photo "https://freecatphotoapp.com"></a>
    <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/101.0.4951.67 Safari/537.36 OPR/87.0.4390.45

Challenge: Step 11

Link to the challenge:

2

Hello, Stephen!
In order to make the cat photo a link.
You need first to make cat photo be surrounded by an Anchor element
For example; If I want to make the name
Stehepen a link
1- Write the name
2- surround by an anchor tag
3- the output should be sth like that
<a href="the link URL must be here">Stehepen</a>

1 Like
3

thanks but it’s not working have tried it severally.

4

Post your latest code so we can see it.

Your initial code does not have any text inside the a element and the href value isn’t correct.

5

Tell us what’s happening:
Describe your issue in detail here.

How can i make cat photos as a link in the anchor element 

  **Your code so far**

<html>
<body>
  <h1>CatPhotoApp</h1>
  <main>
    <h2>Cat Photos</h2>
    <!-- TODO: Add link to cat photos -->
    <p>Click here to view more cat photos.</p>
    <a href="https://freecatphotoapp.com/"></a>
    <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/101.0.4951.67 Safari/537.36 OPR/87.0.4390.45

Challenge: Step 10

Link to the challenge:

6

Are you sure this is the correct step? Your link goes to step 10 which just asks you to make an empty link. Step 11 asks you to add text to that link. Step 12 asks you to make “cat photos” a link in the <p>. Which one are you asking about?

7

am asking about step 11.

8

You already have examples of how to put text inside of an HTML element. Look at the h2 element or p element above the link. You would do the same thing to add text to a link.

9

I have merged the threads as it seems they are actually about the same step.

10 
<html>
  <body>
    <h1>CatPhotoApp</h1>
    <main>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>Click here to view more cat photos.</p>
      <a href="https://www.freecodecamp.org">cat photo</a>
      <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>
11

Your anchor (a ) element’s text should be cat photos .

Your code:

<a href="https://www.freecodecamp.org">cat photo</a>

See something missing? Look at the text that is asked for and your text.

I’ve edited your post 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 (').

12

create anchor tag above the image link and let the href be the link giving to u, then let the anchor closing tag be below the image it should work like that.

13

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.