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

yeaah, m having problem with step 12
i have been trying what i could but to no avail, plase can you help me out,

4

probably good to click on the Restart Step button and try to do this in a different way.
(once the code resets you can try to add new code and hopefully it will go better)

You are to modify this line of code only:
<p>Click here to view more cat photos.</p>

If you look at the preview pane at the start of this step you should see the words are just plain text like this: (nothing clickable).
Click here to view more cat photos.

The objective is to turn the last 2 words only into a link so they will appear to be clickable like this:

Click here to view more cat photos.

You need to do this with an anchor tag.
The anchor tag you need has an opening part and a closing part (called tags).
Opening tag looks similar to:
<a href="website-link">

closing part is </a>

So put an opening tag on the left side of the word cat.
And the closing tag on the right side of the word photos.

Then fill in the website link for the href.

That’s it.

5

please can you send example been trying since, still cant get it right

6

can I see your last try? (or you can Restart the Step again and go thru my last response again? your choice)

7

i’ve resart it followed the step yuo sent earlier still it didn’t work

8

okay, option 2 then, please show me the code…

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

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

11

please leave one space after the word ‘more’
also add the missing > before the word cat

edit: also you need an closing anchor tag which looks like this </a> on the left of the period

12

thank you so much let me get bak to it

13

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

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<a href="https://freecatphotoapp.com" cat photos.</p>
      <a href="https://freecatphotoapp.com">cat photos</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/105.0.0.0 Safari/537.36

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

Link to the challenge:

14

hello, we can see you posted some code. Did you have a question?

15

thanks for your help, i’m moving to the next level

16

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