Nesting the Indoor and Outdoor radio buttons within a fieldset element

HTML-CSS
1

Hello! Step 49 has me stumped. I understand nesting, but I’m unsure about what the prompt asks. At first, I tried nesting both radio buttons within one fieldset element.

Then I tried nesting each one with its own fieldset, but that still doesn’t work. At this point, I’m moving the opening and closing fieldset element tags anywhere just to see what works. What’s missing?

Is my placement really that far off?

Thanks for your time!

  **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>
        <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>
        <label for="indoor">
          <input id="indoor" type="radio" name="indoor-outdoor" value="indoor"> Indoor
          </label><br>
          </fieldset>
          <fieldset>
            <label for="outdoor">
              <input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor
              </label><br>
              </fieldset>
  

          
        <input type="text" name="catphotourl" placeholder="cat photo URL" required><br>
        <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; rv:101.0) Gecko/20100101 Firefox/101.0

Challenge: Step 49

Link to the challenge:

2

I would restart the step to get a fresh start. You only need one <fieldset> element.

“Nest the Indoor and Outdoor radio buttons within a fieldset element.”

Do exactly what this says, nest (or wrap) the radio buttons with one fieldset. Nothing else needs to be done. I’m not sure why the instructions mention indenting the radio buttons because I did not touch them and it still passed for me.

1 Like
3

Thanks so much! Restarting the step worked. I’m not sure why it didn’t work the first time, but oh well, haha

4

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