Learn HTML by Building a Cat Photo App - Step 12

Hello There,

I think I’ve been posting a lot of question pardon me for that anyway

my question is ( it asks me to put starting and closing anchor which I did around Cat photos to turn it into a link but I seem not to understand what he wants by turning the attribute to href to https://freecatphotoapp.com

Your code so far

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

<!-- User Editable Region -->

     <p> See more <a href="https://catphotoapp.com"</a>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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/116.0.0.0 Safari/537.36

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

Link to the challenge:

It’s important to face challenges as a part of learning, so don’t worry :slightly_smiling_face:

The lesson provides us the next explanation:

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

Let’s go point by point:

  • The text given to your 'p' element, turn the words 'cat photos' into a link

    Original text without tags:
    See more cat photos in our gallery.
    
    Your text without tags:
    See more in our gallery.
    

    Review the text in your 'p' element

  • Add opening and closing anchor ('a')

    <a href="https://catphotoapp.com"</a>
    

    You need to close the anchor (a) '>' and add the text 'cat photo'

  • Set your attribute 'href' with the link 'https://freecatphotoapp.com'

    The link you added to your 'href' doesn’t match to the original one

So, they asked you three things, however all of them are wrong, try improving the code and see if it meets the requirements.

You can ask again if you didn’t understand

Cheers

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

check this one maybe I’m missing something , sorry for that

How to create a link using the anchor ('a'):

So, to create a link with a href and a message inside it we need to follow the next rules:

  • opening tag <a> and a closing tag </a>
  • A href attribute to indicate the link
  • The message of the link → Visit the page

Example:

<a href="link.com" >Visit the page</a>

Lets take a close look at your link:

<a href=cat photos"<a/>

So does it have an opening tag and a closing tag? 50/50

your opening tag -> '<a'
and closing tag '<a/>'

Now you know that one is half opened ('<a'), and the other is wrong because the order is not correct '<a/>', check the example above.

Next, does your anchor have a href attribute to indicate the link? Nop
It magically disappeared xd

Last, the anchor has a message? Nop

<a href=cat photos"<a/>

Instead of using the text “cat photo” inside the href, move it outside the tag '>'

Hello!

Here is a good article on turning text and images into links. It has good examples, too.

It may answer your question for you.

@trecosc is doing a great job of guidance.

I just thought maybe this article by one of the leaders may help you, as well.

Turn Image and Text Into Links FCC Article

Happy coding! :slight_smile:

1 Like

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