Learn HTML by Building a Cat Photo App - Step 22

HTML-CSS
1

Tell us what’s happening:
I’ve done every step exactly how it says but it doesn’t let me move foward. I can’t see the error. I’ve read that is because of the double quotes but I tried both “” and ‘’, and it still doesn’t work. I have copied and paste the text so there is not mispelling. I don’t know what to do.
Also, If I take the < before alt, It says is an error, but previously when I put de cat image there was no < before the alt attribute, there is just an space.
I understood that as it is an image it doesn’t need a closing tag, just > Am I wrong?
Please help

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <section>
        <h2>Cat Photos</h2>
        <!-- TODO: Add link to cat photos -->
        <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>

<!-- User Editable Region -->

        <ul>
          <li>cat nip</li>
          <li>laser pointers</li>
          <li>lasagna</li>
        </ul><img src='https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg'><alt='A slice of lasagna on a plate.'>
        

<!-- User Editable Region -->

      </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/109.0.0.0 Safari/537.36

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

Link to the challenge:

2

Alt is a property and needs to be inside of the img bracket it’s describing
Also I’d use “” instead of ‘’ for good measure
You Are correct about an image source not needing a closing tag
Unless of course you are linking to an image using ‘a’ which case it does need a closing tag for the ‘a’

3

After the unordered list ending tag , change the line by pressing the enter key and then add the image tag . The image tag is self - closing tag so it doesn’t need an ending tag. Then add the src (source) and alt (alternate) attribute inside the img tag. You’ve already done the src attribute, so just add the alt attribute like the src one.

4

Once you add the src and alt with the img element. The task is completed
what you’ve done is that you’ve separated the alt attribute from the img element … the alt has to be inside the img element as its an attribute just like the src attribute

1 Like
5

Thank you I could finally completed. I deleted the > at the end of the src

6

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