Learn HTML by Building a Cat Photo App - Step 14

HTML-CSS
1

Im not sure how to separate “cute cats”

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>Everyone loves <a href="cute cats" </a> online!</p>
      <p>See more <a 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.">
    </main>
  </body>
</html>

Your mobile information:

KFONWI - Android 9 - Android SDK 28

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

Link to the challenge:

2

The instructions aren’t asked for separate anything. Instructions is asking you to make the existing text cute cats into a clickable link using anchor opening and closing tags. In one of the previous challenge step, you learned that how to add an anchor element.
Reset the challenge step and try again

1 Like
3 
 <a href="cute cats"

‘cute cats’ is not a valid url

4

Im doing the same thing but i think im doing something wrong because its telling me cute cats should be in the anchor.

5

Hey there!
To put a text inside an anchor tag, you need two things: the text and a url. Here’s an example of turning the word Coder into a link:

<a href="www.myurl.com">Coder</a>

As you can see, we are not putting the word “Coder” inside the href attribute.
This step requires you to use an anchor element and turn the text “cute cats” into a link. I think they’ve also provided a url in the instructions.
Hope this helps!

6

Thanks so much! I will be tryring it

1 Like
7

I got it right but now it says there should be a new anchor element in the first p element.
I’ve tried doing what i think it said but i think im doing smth wrong

8

Can you share your updated code?

9

How do i share my code?

10

can you copy the code from the editor and post it here in a post?

11

Here is how to post code in the forum

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

12

Do you mean like this?

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>Everyone loves <a href="cute cats" </a> online!</p>
      <p>See more <a 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.">
    </main>
  </body>
</html>

[/quote]

13

It looks the same as your original code. You sure you changed anything?

14

no, not like this, there are quite a lot of differences in how the html elements are in these two lines

15

This is what i did so far

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p/>Everyone loves <a href='cute cats</a> online!</p>
      <p>See more <a 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.
16

This is the orginal p element:

<p>Everyone loves cute cats online!</p>

What you need to do is turn the word “cute cats” into a link. right now your code has some problems. first is using the anchor tags <a></a>. If you look closely, you can see that your tags arent written in the correct way.
As I mentioned earlier, an anchor element looks like this:

<a href="www.url.com" >your text</a>

What you’ve done is add the text “cute cats” inside the href attribute, which is incorrect. You need to add a url ( provided in the instructions ) inside the href. and your text “cute cats” goes between the opening and closing anchor tags. Now try step by step to change those words into a link. I would suggest you reset your code and start with the original code.
Good luck!

1 Like