Create a Set of Radio Buttonsn

Tell us what’s happening:

Your code so far

  <p>Click here to view more <a href="#">cat photos</a>.</p>
  <a href="#"><img src="" alt="A cute orange cat lying on its back."></a>
  <p>Things cats love:</p>
    <li>cat nip</li>
    <li>laser pointers</li>
  <p>Top 3 things cats hate:</p>
    <li>flea treatment</li>
    <li>other cats</li>
  <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
     <input type="text" placeholder="cat photo URL" required>

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

Your browser information:

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

Link to the challenge:

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

Your radio buttons are currently before their respective labels.

1 Like

Is there any specific reason for FCC nesting input element within its label? Because as far as I know it is okay to separate the label and input field provided the for attribute of the label matches the id attribute of the input.

They’re practically the same as far as I can tell, but I think it’s just the way the challenge is implemented.