Creating Radio buttons not working

Tell us what’s happening:
I did exactly what the video did, I even copy and pasted it out of desperation, but it keeps telling me “Each of your two radio button elements should be nested in its own label element.” Is the video hint incorrect? I don’t know how to do what its asking me to do, I am so new…

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="https://freecatphotoapp.com/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>
 

  <input type="text" placeholder="cat photo URL" required>
  <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/85.0.4183.121 Safari/537.36.

Challenge: Create a Set of Radio Buttons

Link to the challenge:

1 Like

Nested means that the radio button should be completely inside the label element (i.e. that it should be between the opening <label> tag and the closing </label> tag). Are your radio buttons nested in the label?

1 Like

And if that doesn’t work, at the bottom of the tutorial panel, there should be clear guidelines, IYDUTT, just scroll all the way down on the panel where it’s telling you what to do, there should be alchemy flask icons in tables with some text.

Thanks guys! I got it solved. It didn’t show me anything in the video about putting the input inside the label. Didn’t fully understand what nested meant, so that didn’t help me. However now I understand :slight_smile:

Your welcome, and just to help a bit, nesting looks like this:
<input type="radio"></input>

When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

1 Like

Thank you @ilenia, this works.