Build a Cat Photo App - Step 32

Tell us what’s happening:

What is wrong with this code?

<figure>
            <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field."></figure>

I keep getting: “Sorry, your code does not pass. You’re getting there.” But I don’t know what is wrong, I cannot progress.

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <section>
        <h2>Cat Photos</h2>
        <p>Everyone loves <a href="https://cdn.freecodecamp.org/curriculum/cat-photo-app/running-cats.jpg">cute cats</a> online!</p>
        <p>See more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a> in our gallery.</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>
          <li>flea treatment</li>
          <li>thunder</li>
          <li>other cats</li>
        </ol>
        <figure>

<!-- User Editable Region -->

          <figure>
            <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field."></figure>

<!-- User Editable Region -->

        </figure>
      </section>
    </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/133.0.0.0 Safari/537.36

Challenge Information:

Build a Cat Photo App - Step 32

This is the assignment:

Step 32

To improve the accessibility of the image you added, add an alt attribute with the text:

`Five cats looking around a field.

THIS IS MY CODE:

<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
          </figure>

I cannot see my error.

You surrounded your img tag with a figure element inside a figure element.
Why did you add the additional fig element?

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

1 Like

you have two consecutive opening tags

Thank you so much for commenting!
However, I rechecked my original code (in the app where I code, not here) and I do not see the extra figure element you refer to. If you have the time, please could you clarify what you mean? Thanks in advance!

Thank you so much for commenting! However, the extra figure element does not show in the freeCodeCamp app where I code. It only shows here, in the forum.

I have added a screenshot for clarity. If you have the time, could you clarify this? Thank you in advance!

Sorry! I spotted the issue. Please ignore. Thank you again!

Sorry! I spotted the issue. Please ignore my comment. Thank you again!

1 Like

it looks like you updated your code since you first posted

if you change your code and you still need help you should post your updated code, or people will keep giving you suggestions on outdated code

When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

Thank you for the instructions. I will format any new posts of my codes in future.

However, I noted in replies that I have spotted my mistake (i.e., I identified the extra figure element), so no more assistance is needed. Do I need to do anything else?

Thanks again for your help.

No, you don’t need to do anything else, but please keep this in mind if you need to ask for help in future

2 Likes