Learn HTML by Building a Cat Photo App - Step 15

I have tried several different ways to make this step work, noting is working. I believe I am not understanding what the step requires.

Your code so far

CatPhotoApp

Cat Photos

Click here to view more cat photos.

A cute orange cat lying on its back.
<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
      <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" <a href="http://freecatphotoapp.com" alt="A cute orange cat lying on its back."</a>
    </main>
  </body>
</html>

Your browser information:

User Agent is: Mozilla/5.0 (X11; CrOS x86_64 14092.77.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.4577.107 Safari/537.36

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

Link to the challenge:

there’s a few problems in your code.

First thing you must understand is that the img element you started out with is now broken.
It used to be something like
<img src="something" alt="something else">
and you’ve tried to insert an anchor tag inside it which is a no-no.

To put everything in its place again, click the reset button which looks like an arrow turning.

Now that the code is back to normal, you need to remember that all HTML tags start and end with angled brackets
<a href="www.google.com">
This is an example of an anchor opening tag. Notice how it starts with < and ends with >
Be very careful not to forget this rule.

Second is to understand how to make things into a link.
You need an anchor element which means you need 3 things.
The opening tag for the anchor element.
The closing tag for the anchor element.
And the stuff in the middle that will become the link. In this case the img element is becoming our link.

So place the anchor’s opening tag on the left side of the img element (respecting the angled brackets - do not overwrite them!) and place the closing anchor tag on the right side of the image.

If you take care to write correct code and follow these instructions carefully, you will succeed.

If you are still stuck, then post your latest effort here in response.

  <a href="http://freecatphotoapp.com"> <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."</a>

you are missing a > to the left of the </a>

<alt=“A cute orange cat lying on its back.”>

I figured it out!!! :slight_smile:

1 Like