Learn HTML by Building a Cat Photo App - Step 12

HTML-CSS
1

Tell us what’s happening:
I am struggling with entering the text into the proper format/syntax

Your code so far

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

<!-- User Editable Region -->

      <p> See more cat photos in our gallery <a href="https://freecatphotoapp.com">cat photos</a> </p>
      <a href="https://freecatphotoapp.com">link to cat pictures</a>

<!-- User Editable Region -->

      <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 (Macintosh; Intel Mac OS X 10.15; rv:109.0) Gecko/20100101 Firefox/112.0

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

Link to the challenge:

2

Hello and welcome to the community :smiley:!
Instead of printing your paragraph and then a link to cat photos, you want the actual text ‘cat photos’ that are in your paragraph to turn into a link. To do that your a tags should go inside the actual paragraph and surround the words ‘cat photos’ that are in your paragraph. The rest of your paragraph that are not part of the link comes inside you p element either before or after you a tags. This is called nesting a link in a paragraph.
Ex of paragraph with link:

<p>This is a paragraph with a <a href="">LINK</a> inside it</p>

would look like this on the webpage:

This is a paragraph with a LINK inside it

Hope this helps.
1 Like
3

Hello!

Here is a great article on how to turn both text and images into links. It has good examples, too.

Happy coding! :slight_smile:

4

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