Learn HTML by Building a Cat Photo App - Step 12

HTML-CSS
1

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

Your code so far
Hey I’ve been stuck on this part for sometime. Can you assist me. Let me know what I’m doing wrong.

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->

<!-- User Editable Region -->

      <p><a href="See more cat photos"> in our gallery.</p>
      <a href="https://freecatphotoapp.com">link to cat pictures</a>

<!-- User Editable Region -->

      <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 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/112.0.0.0 Safari/537.36

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

Link to the challenge:

2

The href should not be cat photos, but it needs to be
https://freecatphotoapp.com

Take this as an example

<a href="https://www.w3schools.com">Visit W3Schools.com!</a>

The href is the link to the w3 school website, and the text for the link is “Visit W3Schools.com!” This is how your anchor tag is going to look, but using what the challenge tells you to use.

I would reset the challenge to fix everything, and then try again

3

The (a)s goes inside (p)s or outside

4

The anchor (a) will be inside the paragraph (p)

5

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

Your code so far
In the previous step you turned the words link to cat pictures into a link by placing them between opening and closing anchor (a) tags. You can do the same to words inside of an element, such as a p element.

In the text of your p element, turn the words cat photos into a link to https://freecatphotoapp.com by adding opening and closing anchor (a) tags around these words.

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>See more cat photos in our gallery.</p>
      <a href="https://freecatphotoapp.com">link to cat pictures</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 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/112.0.0.0 Safari/537.36

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

Link to the challenge:

6

I don’t see where you tried to add the link to the text cat photos?

7

Add a target attribute with the value _blank to the anchor (a ) element’s opening tag, so that the link opens in a new tab. whats the target and how to use the _blank

8

Are you on a different challenge? The link you have is still the challenge for turning the words cat photos into a link?

9

Yes. The target and _blank

10

You should use the Ask For Help button if you are on a different step.

11

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