Learn HTML Forms by Building a Registration Form - Step 37

Please I need help at - Step 37
*

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Registration Form</title>
    <link rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <h1>Registration Form</h1>
    <p>Please fill out this form with the required information</p>
    <form action='https://register-demo.freecodecamp.org'>
      <fieldset>
        <label for="first-name">Enter Your First Name: <input id="first-name" type="text" required /></label>
        <label for="last-name">Enter Your Last Name: <input id="last-name" type="text" required /></label>
        <label for="email">Enter Your Email: <input id="email" type="email" required /></label>
        <label for="new-password">Create a New Password: <input id="new-password" type="password" pattern="[a-z0-5]{8,}" required /></label>
      </fieldset>
      <fieldset>
        <label for="personal-account"><input id="personal-account" type="radio" name="account-type" /> Personal Account</label>
        <label for="business-account"><input id="business-account" type="radio" name="account-type" /> Business Account</label>
        <label for="terms-and-conditions">
          <input id="terms-and-conditions" type="checkbox" required /> I accept the <a href="https://www.freecodecamp.org/news/terms-of-service/">terms and conditions</a>
        </label>
      </fieldset>
      <fieldset>
        <label for="profile-picture">Upload a profile picture: <input type="file"  id="profile-picture"/></label>
        <label for="age">Input your age (years): <input type="number" min="13" max="120" id="age"/></label>
        <label for="referrer">How did you hear about us?
          <select id="referrer">
            <option value="">(select one)</option>
            <option value="1">freeCodeCamp News</option>
            <option value="2">freeCodeCamp YouTube Channel</option>
            <option value="3">freeCodeCamp Forum</option>
            <option value="4">Other</option>
          </select>
        </label>
        <label>Provide a bio:
          <textarea for="bio"></textarea id="bio">
        </label>
      </fieldset>
      <input type="submit" value="Submit" />
    </form>
  </body>
</html>
/* file: styles.css */
body {
  width: 100%;
  height: 100vh;
  margin: 0;
  background-color: #1b1b32;
  color: #f5f6f7;
}

label {
  display: block;
  margin: 0.5rem 0;
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/106.0.0.0 Safari/537.36

Challenge: Learn HTML Forms by Building a Registration Form - Step 37

Link to the challenge:

Does the for attribute go on the textarea or the label for the textarea?

Also, I don’t think id attributes (or any attributes) go on the closing tag.

please I’m still not getting it.

this is an example of a label element that is linked to the input field
This is done by adding the for attribute to the label tag and the id attribute to the input tag and making their values identical.

You are just being asked to do that for the bio/referrer etc fields this time around

If you are not sure how to do that, just look at how you did it before…

please I’m still not getting it .

okay the other thing I can suggest is to go back to the cat photo app project step 56.
This is the first time this topic is discussed.
If you go back and try this step 56 again, you will learn how to connect the label and the input using the id and the for attribute.
(then hopefully can apply this here)

I have gone through step 56
(cat photo app) but I’m still not getting it.

okay let’s start with step 56.
What do you think they were teaching there?
They presented the following line of code:
<input id="loving" type="checkbox"> Loving
Then they told you to add a label so you probably did this:
<input id="loving" type="checkbox"> <label>Loving</label>
Then they told you to add a for attribute:
<input id="loving" type="checkbox"> <label for="loving">Loving</label>

So what happened there?
We associated the label with the input by assigning a for attribute to the label that has a matching value as the id of the input.

So far okay?

1 Like

It really, really helps if you ask follow up questions about how you are stuck or show us new code you have tried.

We are not going to write the answers for you. We don’t do that here.

Ok, when next I have a question I will show the new code I have tried. :slightly_smiling_face: .Please don’t get me wrong I wasn’t asking for the answer, I just needed a hint. Thanks for your time. :smiley: