Struggling with Radio buttons

HTML-CSS
#1

I’m struggling a little on the section with radio buttons. Every time I run the test, it says I need to close my label with a tag. I’m missing something, but I can’t figure it out. If anyone has some insight, I’d appreciate it :slight_smile:

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://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
 </label>
 <p>Things cats love:</p>
 <ul>
   <li>cat nip</li>
   <li>laser pointers</li>
   <li>lasagna</li>
 </ul>
 <p>Top 3 things cats hate:</p>
 <ol>
   <li>flea treatment</li>
   <li>thunder</li>
   <li>other cats</li>
 </ol>
 <form action="/submit-cat-photo">
   <input type="text" placeholder="cat photo URL" required>
<label for="indoor"></label>
<label><input id="indoor" type="radio" name="indoor-outdoor">Indoor</label>

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

   <button type="submit">Submit</button>
 </form>
</main>

Your browser information:

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

Challenge: Create a Set of Radio Buttons

Link to the challenge:
https://www.freecodecamp.org/learn/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons

#2

Hi @Jennifer226, welcome to the forum.

It seems that you have accidentally written two label tags for the indoor radio button, and the one that has the “indoor” for attribute isn’t the one in which the radio button is nested.

If you fix that problem the check should pass. Hope that helps!

#3

hello! @Jennifer226
you just need to do is, use two radio button and that should be given the “name” attribute of “indoor-outdoor” and use capitalization to give name in label.hope that helps!
here is an example to understand better,

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

if you use the for attribute make sure it is exactly the same of the id attribute of the input element. you have indoor and Indoor - if they were not nested these would not be connected.

#5