Challenge number 33: https://www.freecodecamp.org/challenges/create-a-set-of-radio-buttons
This challenge asked me to create separate labels of each radio button.
“Each of your radio buttons should be nested within its own label element”, they say.
I’m a little confused here because when I used only one label for all of the radio buttons, to me it worked the same way as it did when I used separate labels of each radio button.
Here’s ‘how they want’ snippet of code:
<button type="submit">Submit</button>
<label>
<input type="radio" name="indoor-outdoor"> Indoor
</label>
<label>
<input type="radio" name="indoor-outdoor"> Outdoor
</label>
And here’s ‘how I’d like it to be’:
<button type="submit">Submit</button>
<label>
<input type="radio" name="indoor-outdoor"> Indoor
<input type="radio" name="indoor-outdoor"> Outdoor
</label>
Also I’ve tried removing label from everywhere, it still worked. Worked like a charm.
Can someone please explain to me, specifically what is the use of label and when to use it?
Thanks in advance