Build a Cat Photo App - Step 14

HTML-CSS
1

Tell us what’s happening:

Step 14
Turn the existing text cute cats into an anchor element that links to:

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->

<!-- User Editable Region -->

      <p>Everyone loves cute cats online!</p>
      <a href="https://cdn.freecodecamp.org/curriculum/cat-photo-app/running-cats.jpg"></a>

<!-- User Editable Region -->

      <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 browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/135.0.0.0 Safari/537.36

Challenge Information:

Build a Cat Photo App - Step 14

2

Please Tell us what’s happening in your own words.

Learning to describe problems is hard, but it is an important part of learning how to code.

Also, the more you say, the more we can help!

3

If you look at the line right below where you showed your editable region, that is a perfect example of the structure you need to build. See how the <a href></a> element is inside the <p></p> element? And see how there are words between the <a> and the </a>?

The reason is that what it’s trying to teach you is how to code it if you want words in a sentence to link to something else. So what it wants is for the words “Everyone lones cute cats online!” to be on the screen and the words “cute cats” to link to the picture.

Happy coding!