Learn HTML Forms by Building a Registration Form - Step 17

I’m still having a hard time figuring out where to put the for attribute inside the label. would it be…<
input id=“first-name”/><label for="first-name"First Name
I feel like this should be correct but it is not working.
please help… I’ve been at this for 48 hours really trying hard to figure out where the for attribute belongs in the label

I meant

input id=“first-name” /><label for="first-name"First Name

I’ve edited your code for readability. 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

It is not correct. However there is hope!

Did you complete the cat photo app sections already? If not, this is probably why you are struggling. I would suggest that course should be done first.

If yes, please go back to step 55 (in the cat photo app project) and the instructions there should remind you of some of what you need to finish this exercise.

<p>Thanks for the tip</p>

I’ll keep trying, I went back through the cat photo and it didn’t give any help of where I place the for attribute , I’ve tried every possible scenario it looks like you need to put a label in front of the for attribute and close the label again but it is already inside of a label

where is a backtick located on the keyboard ? 
 mind is blown up right now
<label>Enter Your First Name: <input id="first-name"/><label for="first-name"First Name</label></label>

is this correct or even close? please help me I'm pulling my hair out over here

Hi @Trueq. Don’t give up! You can do this!

Please be aware that an element consists of an opening tag <...> and a closing tag </...> except if the element is a self-closing tag like the img element or the input element.

If you reset the step, You are given this piece of code

      <fieldset>
        <label>Enter Your First Name: <input /></label>
        <label>Enter Your Last Name: <input /></label>
        <label>Enter Your Email: <input /></label>
        <label>Create a New Password: <input /></label>
      </fieldset>

As you can see the input element are INSIDE the label element. Am I correct? This is one way to link a label into an input. But some old browser do not recognize this method. Hence we are still linking the label into an input in ANOTHER way.

Next step let’s digest the question part by part. In the first paragraph it says:

Following accessibility best practices, link the input elements and the label elements together using the for attribute.

How do we link the <label> element and the <input>?

The documentation here mentions how to use the for attribute in relation to the input that it is trying to link like so

<label for="username">Your name</label>
<input type="text" id="username">

As you can see that the for attribute of the <label> HAS to be the SAME as the id of the <input> element.

So what should I write for the id of the <input> attribute?

The hint is in the second paragraph of the question which says:

Use first-name , last-name , email , and new-password as values for the respective id attributes.


Help! I am still stuck

If you are still stuck try to identify which part you are stuck, and try to come up with specific questions. Explain what you did in a code enclosed by triple backticks like this.

```html
paste code here
```

Biggest hint of all: You should NOT add a new element. Only attributes.

Hope this helps!

2 Likes
<fieldset>
        <label>Enter Your First Name: <input /></label>
        <label>Enter Your Last Name: <input /></label>
        <label>Enter Your Email: <input /></label>
        <label>Create a New Password: <input /></label>
  
<p>as you can see I am not getting the code you are getting. there is no type="text" part in there<p>

You are right. Let me edit my post then

1 Like
<label>Enter Your First Name: <input id="first-name" for="first-name"First Name ></label>

n

<input id="first-name" for="first-name"First Name ></label>

That is one step to the correct solution!

However, what is FIrst Name doing there? It should be after the input element, not insdie it…

You don’t need to add the “First Name” anymore

Anyway it would be easier if you restart the step. I have written examples for this step in this comment here

  • for attribute is for <label>
  • id attribute is for <input>

Don’t put those two in <input> -__-

2 Likes

:cry: I’m crying over here :cry:

Take it slow! I know this is hard to grasp. Perhaps you can take a little break and continue this later?
This can often be frustrating! But we are all here to support your coding journey.
We know you can do this!

1 Like

ok, I’m going to bed. I’ve been stuck on step 17 for 3 days. I thought I had it but it didn’t work. my dreams are shattered as of this moment. but, alas there is always tomorrow.

Let’s take it one a time. (For tomorrow)

Here is one of the starting code

<label>Enter Your First Name: <input /></label>

An attribute is a key-value pair that goes inside the opening tag to describe an element.

  • Key value pair means like this for="email"
  • An opening tag is this <label>
  • an Element consist of opening tag <label> and closing tag </label>

This is an example of a href attribute inside an anchor (a) element.

<a href="https://www.example.com">This is inside the element.</a>

Now you know that for attribute goes to the <label> element AND the id attribute goes to the input element.

Can you try creating the code tomorrow? Thank you

1 Like

I will try, thank you for your help. :slightly_smiling_face:

2 Likes

This might Help

[Mod edit: solution removed]

<label>Enter Your First Name: <input id="first-name"><label for="first-name"</label></label>

Am I getting close? My issue is the for attribute, I realize this goes inside the label and for what I researched First Name should go after <label for="first-name"First Name </la bel>…(space inside label so you can see my plight) at least that is what I would think. But can you put a label with a for attribute inside a label? Where in the heck do I put the for attribute? Why is this so hard? Pulling my hair out, now almost bald :woozy_face: :rofl: :joy: