Learn HTML by Building a Cat Photo App - Step 12

Tell us what’s happening:

Describe your issue in detail here.

Your code so far

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

<!-- User Editable Region -->

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

<!-- User Editable Region -->

Blockquote

<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/118.0.0.0 Safari/537.36

Challenge Information:

Learn HTML by Building a Cat Photo App - Step 12

You turned the entire sentence See more cat photos in our gallery. into a link. You only want to turn the words “cat photos” in the middle of that sentence into a link.

6 Likes

As per the guidance of @bbsmooth sir you need to only wrap the text cat photos into an anchor tag

So that that text will get convert into an link.

Second kindly remove the . so that you code will get passed easily.

Hope you understand.

3 Likes

see more cat photos in our gallery

i think your mean this, but it still not working
2 Likes

Welcome to the community @Amritpal2 !

Could you please post the updated code using three backticks ``` before and after all code?
Or you could use the Help that appears after three unsuccessful attempts at any step in Responsive Web Design to post the code.

This will allow the community to see what is happening and provide you with quick, focused and accurate guidance.

Thanks!

Keep up the good progress!

3 Likes

see more cat photos in our gallery

1 Like

Please use the following method to paste your HTML in here so we can see your actual HTML.

To display your code in here you need to wrap it in triple back ticks. On a line by itself type three back ticks. Then on the first line below the three back ticks paste in your code. Then below your code on a new line type three more back ticks. The back tick on my keyboard is in the upper left just above the Tab key and below the Esc key. You may also be able to use Ctrl+e to automatically give you the triple back ticks while you are typing in the this editor and the cursor is on a line by itself. Alternatively, with the cursor on a line by itself, you can use the </> button above the editor to add the triple back ticks.

3 Likes
Turn the image into a link by surrounding it with necessary element tags. Use https://freecatphotoapp.com as the anchor's href attribute value.

<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>
      <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">
1 Like

From what you pasted above it seems like it should pass. But you didn’t paste all of your HTML in here so I can’t be 100% sure about that.

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

(Turn the image into a link by surrounding it with necessary element tags. Use `https://freecatphotoapp.com` as the anchor's `href` attribute value.)

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

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