Each of your two radio button elements should be nested in its own `label` element

HTML-CSS
1

Tell us what’s happening:
I’ve been stuck on this for a while now. Assistance is greatly appreciated.

Everything is checked off, except for the one below.
“Each of your two radio button elements should be nested in its own label element.”

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>

<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 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/70.0.3538.102 Safari/537.36 Edge/18.18362.

Challenge: Create a Set of Radio Buttons

Link to the challenge:

2

Did you see the example of how to nest your radio button in a label in the lesson? You have not nested your radio button inside a label. Exactly duplicating the video will not yield the correct solution.

3

Let me go back and recheck The video was my latest attempt on trying to pass this.

1 Like