Learn HTML by Building a Cat Photo App - Step 56

HTML-CSS
1

Tell us what’s happening:

Hi I dont know what is wrong here, I tried so many variation like using the label tag, the name attribute. but in this lesson it does not say to use the label tag.

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>
          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
        </figure>
      </section>
      <section>
        <h2>Cat Form</h2>
        <form action="https://freecatphotoapp.com/submit-cat-photo">
          <fieldset>
            <legend>Is your cat an indoor or outdoor cat?</legend>
            <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor"> Indoor</label>
            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label>
          </fieldset>
          <fieldset>

<!-- User Editable Region -->

            <legend>What's your cat's personality?</legend>
            <input type="checkbox" id="loving">Loving

<!-- User Editable Region -->

          </fieldset>
          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
          <button type="submit">Submit</button>
        </form>
      </section>
    </main>
  </body>
</html>

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Challenge Information:

Learn HTML by Building a Cat Photo App - Step 56

2

You weren’t asked to add an id attribute.

Also look at how you did the spacing before the text on your radio buttons above. You may need to also play with spacing to get it to pass.

2 Likes
3

Debes de quitar el atributo id y al final del elemento input dejar un espacio.
ejemplo:
Loving

1 Like
4

Hey Buddy

<input type="checkbox" id="loving">Loving

Here You’re instructed to put only it’s type , not id.

Remove it

2nd thing put Space after your close input element…

<input> Code

Hope You Understand.
1 Like
5

I have used your words but that dosen’t worked, please help me here’s my code and the hint:

What's your cat's personality? Loving hint: The text `Loving` should be located directly to the right of your checkbox. Make sure there is a space between the element and the text. You have either omitted the text or have a typo.
6

Hi @mughdoislam444 Please can you open a new topic for your issue and post your code. It will be a good idea to follow the suggestions above, in particular with regard to spacing and the text after the input element. If you are still having a problem please open a new topic.