Regarding labels and nesting

Tell us what’s happening:
// running tests Each of your two radio button elements should be nested in its own

label

element. // tests completed

So as you can read above, I’m not nesting the radio buttons correctly, I have checked and checked to prevail can someone please explain how to set “nest in its own”

  **Your code so far**

<h2>CatPhotoApp</h2>
<main>
<p>Click here to view more <a href="#">cat photos</a>.</p>

<a href="#"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>

<p>Things cats love:</p>
<ul>
  <li>fucking rabbits</li>
  <li>laser lights at doofs</li>
  <li>lasagna on their paws</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
  <li>not getting free spins on "more chilli"</li>
  <li>pissing in public</li>
  <li>war</li>
</ol>
<form action="https://www.freecatphotoapp.com/submit-cat-photo">
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>

<input id="indoor" type="radio" name="indoor-outdoor">
<label for="indoor">Indoor</label>


<input id="outdoor" type="radio" name="indoor-outdoor">
<label for="outdoor">Outdoor</label>

</form>
</main>
  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.82 Safari/537.36

Challenge: Create a Set of Radio Buttons

Link to the challenge:

also tried

//input id="indoor" type="radio" name="indoor-outdoor"> //label for="indoor">Indoor ///label>

//label>
//input id=“outdoor” type=“radio” name=“indoor-outdoor”>
//label for=“outdoor”>Outdoor
///label>

Hi @PatttyT,

When we run a test for the code you have it says: Each of your two radio button elements should be nested in its own label element.

Let’s watch your code now:

<input id="indoor" type="radio" name="indoor-outdoor">
<label for="indoor">Indoor</label>

<input id="outdoor" type="radio" name="indoor-outdoor">
<label for="outdoor">Outdoor</label>

As you can see, your input are not nested into each label tag. They are out.

You should watch the example give in the course:

<label for="indoor"> 
  <input id="indoor" type="radio" name="indoor-outdoor">Indoor 
</label>

This is what they are expecting you to do. Even if what you did is not wrong, it a way to do too. But it is not the exercice. Hope it helps.

1 Like

even with trying this, i’m still coming up with the problem not nested in own labels.

I literally just deleted all my code, copy and pasted from example and it passed,

Ok, when I was putting your inputs into the labels it was working, don’t know what was wrong. But good you arrived to figured it out. Good luck for the next challenges!

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