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 cat photos.</p>
<a href="https://freecatphotoapp.com"><p/a>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/106.0.0.0 Safari/537.36
Challenge: Learn HTML by Building a Cat Photo App - Step 12
Link to the challenge:
Sorry, every looks like step 12 has me stuffed at the moment. I have tried it multiple times. I know it won’t look like it in the code because I went to restart step before I posted this. I will have another go and see what I get wrong and post it.
Thanks, everyone.
1 Like
Ok, guys, I’ve had a bit of a go with it and this is what I got:
<a> href="https://freecatphotoapp.com"><p/a>link to cat pictures<p/a>
I don’t know why it’s not coming up but there is a, anchor at the start
You are to nest the “cat photos in your " a” tag
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.
See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').
in this step you are originally shown these 2 lines of code:
<p>Click here to view more cat photos.</p>
<a href="https://freecatphotoapp.com">link to cat pictures</a>
(you can get them back by clicking the Restart Step button to reset)
the top line is a plain text paragraph which renders like below on your preview pane:
Click here to view more cat photos.
While the bottom line which is a link shows up like this:
link to cat pictures
The idea here is to change the top line only so that the preview pane displays it like this:
Click here to view more cat photos.
To do that you need to carefully add some code inside of the p element.
That code is an anchor opening tag on the left of the cat
and a closing anchor tag on the immediate right of the word photos
Hopefully knowing this, you can redo this step correctly.
Happy coding.
1 Like
<p>Click here to view more <a href= "cat photos".<a/p>
<a href="https://freecatphotoapp.com">link to cat pictures</a>
It’s ok I just solved it.