Learn HTML by Building a Cat Photo App - Step 56

HTML-CSS
1

Tell us what’s happening:
Stuck on this step…any hints please your issue in detail here.

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>
        <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>
            <legend>What's your cat's personality?</legend>

<!-- User Editable Region -->

        <input id="loving" type="checkbox"> 
          <label for="loving" > </label> 

<!-- 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 (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 56

Link to the challenge:

2

What are you struggling with in this challenge? Can you explain the problem in your own words?

Have you followed these instructions precisely?

Associate the text Loving with the checkbox by only nesting the text Loving in a label element and place it to the right side of the checkbox input element.

3

As far as I understand it, I think I have.

I

4

You haven’t nested any text within the label element.

5

tried this but this didn’t work either

6

7 
<label attribute="value">Text</label>

This should be the syntax for your label element.

8

They want you to add the for attribute to label tag and unlike the radio button, the checkbox input tag will not be within label tag. They are trying to teach the alternate of how we can associate the input tag. This is what they want you to write.

mod edit: solution redacted

9

It’s best not to post solutions but try to help people figure it out for themselves, with hints or advice. Your solution doesn’t pass anyhow… there’s a mistake.

10

please do tell the mistake apart from /, so i can correct myself. Thanks.

11

There should be a space between the two elements.

12

You must not share solutions on the forum. Please stop.

13

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