Tell us what’s happening: error is - You should give the second label a for attribute matching the id of its input element.
doesn’t make sense. first, no id’s. I research it and it says make up your own so I did. Verified how to code it on web. STILL error. HELP!
Your code so far
WARNING
The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.
You will need to take an additional step here so the code you wrote presents in an easy to read format.
Please copy/paste all the editor code showing in the challenge from where you just linked.
Replace these two sentences with your copied code.
Please leave the ``` line above and the ``` line below,
because they allow your code to properly format in the post.
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36
Challenge: Learn Accessibility by Building a Quiz - Step 30
<ul class="answers-list">
<li>
<label for="username">Enter username
<input id="username" type="radio"
</label></input>
</li>
<li>
<label for"username1">Enter username1
<input id="username1" type="radio"
</label></input>
</li>
</ul>
</fieldset>
</div>
<div class="question-block">
<p>2</p>
<fieldset class="question" name="html-question-two">
<legend>
A label element nesting an input element is required to have a
for attribute with the same value as the input's id
</legend>
<ul class="answers-list">
<li>
<label for="username2">Enter username2
<input id="username2" type="radio"
</label></>
</li>
<li>
<label for="username3">Enter username3
<input id="username3" type="radio"
</label></>
</li>
</ul>
<ul class="answers-list">
<li>
<label for="username2">Enter username2>
<input id="username2" type="radio">
</label</>
</li>
<li>
<label for="username3">Enter username3>
<input id="username3" type="radio">
</label</>
</li>
</ul>
error message - You should give the second label a for attribute matching the id of its input element.```
here is the code. idk if it is exact from when I answered. I have been researching and making edits. It still says - " You should give the first label a for attribute matching the id of its input element." -
I have done that, yes? from what I am reading online I have done that.
<ul class="answers-list">
<li>
<label for="username">Enter username</label>
<input id="username" type="radio"
</li>
<li>
<label for"username1">Enter username1</label>
<input id="username1" type="radio"
</li>
</ul>
</fieldset>
</div>
<div class="question-block">
<p>2</p>
<fieldset class="question" name="html-question-two">
<legend>
A label element nesting an input element is required to have a
for attribute with the same value as the input's id
</legend>
<ul class="answers-list">
<li
<label for="username2">Enter username2</label>
<input id="username2" type="radio"
</li>
<li
<label for="username3">Enter username3</label>
<input id="username3" type="radio"
</li>
</ul>
yet, still an error. I have changed id’s and names since I last posted. Here is what I have inputted (only pasted the first two sections) and here is the error again - " You should give the first label a for attribute matching the id of its input element."
<ul class="answers-list"
<li
<label for="One">
<input id="One" type="radio" name="I am One">I am One
</label>
</li>
</ul>
<ul class="answers-list"
<li
<label for="Two">
<input id="Two" type="radio" name="I am Two">I am Two
</label>
</li>
</ul>
You might consider running your HTML through a validator to find all of these little mistakes for you.
But really, none of this should have been changed in the first place because the only thing you were supposed to do was add for attributes to the labels and corresponding ids to the inputs. My suggestion would be that if you start making too many changes and you don’t pass then restart the step to get the original HTML back and try again. This will help you avoid all of these accidental changes.
thanks. I am doing this. omg. I am pathetic. so many errors. sorry for all this hassle. I am honestly trying. Just not grasping this exercise as well as the others.
No, not pathetic, just part of learning. Take my advice, when you can’t seem to get it to work then restart the step to get the original HTML back and start fresh.
thanks I did restart - twice. I did a validator - here is the link to the results (area that we are working with) https://validator.w3.org/nu/#textarea
you can see in the validator the error that the test is saying is not highlighted. Also, the tagging errors I need an explanation about, if possible.
here is my code `
Item One
</li>
<li>
<label for="radio2">Item Two</label>
<input type="radio" id="radio2" name="Item Two">
</li>
</ul>
</fieldset>
</div>
<div class="question-block">
<p>2</p>
<fieldset class="question" name="html-question-two">
<legend>
A label element nesting an input element is required to have a
for attribute with the same value as the input's id
</legend>
<ul class="answers-list">
<li>
<label for="radio3">Item Three</label>
<input type="radio" id="radio3" name="Item Three">
</label>
</li>
<li>
<label for="radio4">Item Four</label>
<input type="radio" id="radio4" name="Item Four">
</li>
</ul>`
Error STILL says - You should give the first label a for attribute matching the id of its input element. - which doesn’t seem to be showing up in the validator (unless I am missing it).
Also, make sure you run all of the HTML through the validator, not just the part you are working on. But if you reset the step and start fresh then you really shouldn’t need to validate because the default HTML should be good.
sure, will do and post. is there an easier way to copy/paste from the learning dashboard other than right click? odd question yet I would assume there would be a button of sorts to help me out so I don’t mistakenly delete what I have done (happened once)
No, but I’ve been thinking that there should be lately. It would make helping people a lot easier, especially on the projects. I might try to come up with something to present to the team