Step 14 - HTML code

HTML-CSS
1

Tell us what’s happening:
Question: Turn the image into a link by surrounding it with necessary element tags.
Use https://freecatphotoapp.com as the anchor’s href attribute value.

I still don’t understand what’s wrong in my code. I have done everything that the question asked. Checked forum and found out that my code is right. But still the system wouldn’t pass the code. Need someone with experience to find this out.
Thank you

  **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"> 
                                                           <img  src= "https://cdn.freecodecamp.org/curriculum/cat- 
                                                             photo-app/relaxing-cat.jpg"> </a>
    </p>
  </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/102.0.0.0 Safari/537.36

Challenge: Step 14

Link to the challenge:

2

<a href="LINK HERE"><YOUR IMG TAG COMES HERE WITH SRC AND ALT></a>

3

Thank you. Below is what I typed - it still didn’t pass.

A cute orange cat lying on its back.

Below is the hint given by Freecodecamp

Hint

Your anchor (a) element should have an opening tag. Opening tags have this syntax: <elementName>.

4

Hi @Vijima ,

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.

```
Your code goes here
```

You can also use the “preformatted text” tool in the editor ( </> ) to add backticks around text.

5

Thanks Spark
Just realized that my code is not visible instead its the cat picture

My code is

image
image1920×1080 452 KB

Please let me know what’s wrong in this code.

  1. Should the answer not show the cat picture?
  2. Should it show only the link to the picture?
  3. The hint given is :
    Your anchor (a ) element should have an opening tag. Opening tags have this syntax: <elementName> .
    I believe I have entered the anchor element correct.
6

Please restart the challenge, as you have changed the original code.

You should only turn the img into a link and it should still be below the p element not within it.

7

Hi Spark
Still no luck. its related to anchor element - still not able to figure out what it is.

image
image1920×1080 461 KB

8

You are missing the opening a tag :

You are also missing the closing a tag (</a>) on line 7:

<p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
9

Wow, Thank you so much! I didn’t realize that I had to give the link twice and that I need to enter the anchor elements twice.
It worked now .

1 Like
10

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