Hi, can you check what is wrong here please?

HTML-CSS
1

Tell us what’s happening:

As you can see below, I put exactly the same code from the video instruction.
But it doesn’t work… So, I’m stuck in this lecture… can’t move on. Could you check if there is any error that I overlooked?

Thank you.

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">
   <lable for="indoor">Indoor</lable>
   <input id="outdoor" type="radio" name="indoor-outdoor">
   <lable for="outdoor">Outdoor</lable>

  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
</form>
</main>

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.4 Safari/605.1.15.

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

Hello welcome to the forum!

  1. Check your spelling of “label”.

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

2 Likes
4

Thank you so much for your comment :slight_smile:
However, I don’t understand the second one… so I’m stuck here

  1. Each of your two radio button elements should be nested in its own label element.
    Could you explain it please?

5

nested means put inside each other
you have the input element after instead of inside the label element

ignore the video for this, it is wrong

1 Like
6

Hey @Mongsta9!

Input has to be between the Label tags like that:

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

I hope it helped and its clearly visible that the “input” its between the label-open and label-closing tags.
In your case labels are do not have any input that`s why its not working.

1 Like
7

It worked perfectly… you’ve saved my life!!! thanks a million