Learn HTML by Building a Cat Photo App - Step 16

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
I can’t insert the section element as requested
Your code so far

<html>
  <body>

<!-- User Editable Region -->

    <main>
      <h1>CatPhotoApp</h1>
      <catphotos>
      <section>  
        <h2>Cat Photos</h2>
        <!-- TODO: Add link to cat photos -->
      <catphotos>
        <p>See more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a> in our gallery.</p>
      <catphotos>
        <a href="https://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>
     </section>
    </main>

<!-- User Editable Region -->

  </body>
</html>

Your browser information:

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

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

Link to the challenge:

2

Why did you add these catphotos tags? The instructions did not ask you to do so and these tags don’t exist in HTML.

As a general rule, only do exactly what the instructions ask and no more. Making any other changes will most likely cause the tests to fail.

3

The issue with your code is that the section element is not properly nested within the main element and its opening and closing tags are not correctly matched.

In HTML, elements should always be properly nested within each other. This means that the opening tag of an element should always be followed by the closing tag of that same element, and any elements contained within should also be properly nested within those tags.

In your code, the opening tag of the section element is correctly placed within the main element, but the closing tag of the section element is not correctly nested within the main element. This can cause problems with how the web page is rendered, as the browser won’t know where the section element ends.

To fix this, you need to make sure the closing tag of the section element is properly nested within the main element, something like this:

<main>
  <section>  
    <!-- content of section element-->
  </section>
</main>