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

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p> <a href='https://freecatphotoapp.com'> cat photos </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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36

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

Link to the challenge:

2

:balloon: Hi, welcome to the forum!
We see you have posted some code but did you have a question?

3

Please Tell us what’s happening in your own words.

Learning to describe problems is hard, but it is an important part of learning how to code.

Also, the more you say, the more we can help!

4

yes
trying to get used to the terms cause I am very new to the coding world. few hours new .
I got stuck here change answer my resent post

5

please russet the step to restore the original code because you removed code that is needed.

after that, notice the following:

In the code you now have a paragraph element with plain text words. In the preview pane, you can see the words look like this

Click here to view more cat photos.

What they are asking you to do is change these words as follows:

Click here to view more cat photos.

Such that the last two words become clickable.

You do this using an anchor tag (review anchor tags in step 10 and 11)

Hope this helps

6

i am trying to turn link to cat pictures into a link inside a P element

7

Thank you so much
Please what exactly should be nested in the anchor tag

8

We don’t write the answers for you.

What do you have when you reset the code and only add an anchor element inside of the p element?

9

here is an example of an anchor tag - note it has three parts

<a href=“#”>Click Me!</a>

the opening tag goes on the left of the words Click Me! because this words are what we want the user to click on

then we place a closing tag on the right of the words

edit: so always nest the words or element that you are turning into a link between the anchor tag start and end

10

i do this
<p><a href="https://freecatphotoapp.com">Click here to view more cat photos</p>
and they hint this
The llink text should be cat photos . You have either omitted the text or have a typo.

i am so clueless. ill keep trying
thank you so much
i appreciate

11

Click here to view more cat photos

12

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

13

do you think the way you wrote the anchor tag is making the whole sentence into a link or just the last two words?

they want only the last two words to be a link.
also do not delete the period. (review my post above to see what the final sentence should look like)

14

i am having the same problems…

Click here to view more cat photos.<a href= https://''freecatphotoapp.com" cat photos

please help
15

If you have a question about a specific challenge as it relates to your written code for that challenge, just click the Ask for Help button located on the challenge. It will create a new topic with all code you have written and include a link to the challenge also. You will still be able to ask any questions in the post before submitting it to the forum.

Thank you.

16

i finally got it …i was so happy when i saw congratulation …took me 6hrs to figure
took time off and came back to really understand .now i see what you have been trying to explain.
i was actually interfering with the p element earlier. i was supposed to just create the anchor a tag around the link and the text.
Thank you so much

1 Like
17

this was helpful
thank you so much all

18

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