Learn HTML by Building a Cat Photo App - Step 26

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**
<html>
<body>
  <h1>CatPhotoApp</h1>
  <main>
    <section>
      <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>
      <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>
    <section>
      <h2>Cat Lists</h2>
      <h3>Things cats love:</h3>
      <ul>
        <li>cat nip</li>
        <li>laser pointers</li>
        <li>lasagna</li>
      </ul>
      <figure>
        <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
        <figcaption>Cats <em>love</em> lasagna.</figcaption>  
      </figure>
      <h3>Top 3 things cats hate:</h3>
      <ol>flea treatment thunder other cats</ol>
    </section>
  </main>

</body>
</html>

I thought that is after the last h3 in the second section.
Am I close?

  **Your browser information:**

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

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

Link to the challenge:

In order for the text to come out properly, as follows:

Top 3 things cats hate:

  1. flea treatment
  2. thunder
  3. other cats

You need to nest inside the ‘organized list’ element, one ‘list item’ element for every item, just like you previously did with the unorganized list.

2 Likes

Hi @SuperMeaks ,

The ul element represents an Unordered List of items, typically rendered as a bulleted list.

  • item 1
  • item 2

The ol element represents an Ordered List of items, typically rendered as a numbered list.

  1. item 1
  2. item 2

The li element represents an item in a list ( li : List Item ) . It must be contained in a parent element: an ordered list ol or an unordered list ul.

The code for an ordered list ol is similar to an unordered list ul.
You just use <ol></ol> tags instead of <ul></ul> tags.

These are three different items, each one should be within li tags :

2 Likes

Thank you so much for the help :grin: :grin:

2 Likes