Build a survey form error - #name-label should be a <label> element : expected 'INPUT' to equal 'LABEL'

Someone help me fix this error please

#name-label should be a <label> element : expected 'INPUT' to equal 'LABEL'

I have these two pieces of code but none will pass.

<label for="name-label">
          <input type="text" id="name-label" name="name-label" placeholder="First Name" required>
</label>
<label for="name">
          <input type="text" id="name" name="name" placeholder="First Name" required>
</label>

Can someone please explain what I am missing?

Please post a link to your codepen

But if you look the element with id "name-label" is an input element, when it should be a label element, you gave that is to the wrong thing

Hi @ilenia here is the link to the codepen https://codepen.io/Benmuiruri/pen/dEbQKB

Also to respond to your reply. I have an input with the id name-label but the input is inside a label with the name name-label

But this seems to want the label element to have id of “name-label”, it is also in the name of the id

Thanks @ilenia, putting an id in the label element fixed the error.

But I must say that the way that requirement is phrased can cause confusion. I understood it as

You should have a label with a for to describe the label and within that label you should have an input elment with an id of name-label.

Instead, the instruction was to have a label element with and id of name-label.

  • User Story #4: Inside the form element, I am required to enter my name in a field with id="name" .
  • User Story #10: For the name, email, and number input fields inside the form I can see corresponding labels that describe the purpose of each field with the following ids: id="name-label" , id="email-label" , and id="number-label" .

Do you mean this one?

yes, I mean user story #10.

User Story #4 is clear.