Design a registration form - Step 33 - Field set label issue

Preformatted texthi. okay doing the registration form. and says to put my text area and label after the third field set after the label. which label? as totally blind and tried doing this and so can you help me out, where to put this. so, have reset the lesson. not passing and not sure what it is talking about, can you explain or tell me where to put this and to get it to pass.
sorry.
did try typing it in the editor. but no go.
so will paste the error. the step. and the html code.
so can you help me out. or is it spacing, foor formatting. using visual studio code and using the jaws for windows screen reader 2025, and google chrome on windows 11 pro.
so will paste the error message.
the link to the step, and use the preformatted as cannot find the backtip key on my keyboard and actually awkward to find on a laptop keyboard.
so pasting below.
yes did reset the lesson, did not fix. wish they would be more explaining more as a screen reader user and cannot see. trying my best.
marvin.

type or paste code here

<!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 method="post" 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>
        <legend>Account type (required)</legend>
        <label for="personal-account"> 
          <input id="personal-account" type="radio" name="account-type" checked />
           Personal 
          </label>
        <label for="business-account"> 
          <input id="business-account" type="radio" name="account-type" />
           Business 
          </label>
      </fieldset>
      <fieldset> 
        <label> 
          Upload a profile picture:
                <input type="file">
                </label>
                <label>
                  Input your age (years):
                  <input type="number" min="13" max="120">
                </label>
                <label>
How did you hear about us?
                                <select>
                  <option value="">(select one)</option>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>
                                    </option>
                </select>
                </label>
              </fieldset>
              <label for="bio"> 
                Provide a bio:
                <textarea id="bio" name="bio" rows="3" cols="30"> 
                                  </textarea>
              </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/" target="_blank"> terms and conditions</a>
      </label>
      <label>
      <input type="submit" value="Submit" />
      </label>           
    </form>
  </body>
</html>

type or paste code here

You should add a label element at the end of the third fieldset , after the existing label elements.

hello marvin, can you also share this exercise/step url as well? thanks and happy coding :slight_smile:

the backtick should be on the key next to the 1, going by the standard layout used in your area

the new label is after the third fieldset, it should be inside the third fieldset

please post the link to the step

hi. heres the step. okay, will just then cut and paste and stick inside the third field set.
sorry.
trying my best. and not able to see as totaly blind and using jaws for windows screen reader. will report back.
thanks.
marvin.

hi. getting this error. so will then paste the code for the field set. or just my whole code. so why? annoying. and dont get it. sorry.
marvin.
ps: pasting below.
You should give the textarea element opening and closing tags.

type or paste code here

<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 method="post" 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>
        <legend>Account type (required)</legend>
        <label for="personal-account"> 
          <input id="personal-account" type="radio" name="account-type" checked />
           Personal 
          </label>
        <label for="business-account"> 
          <input id="business-account" type="radio" name="account-type" />
           Business 
          </label>
      </fieldset>
      <fieldset> 
        <label> 
          Upload a profile picture:
                <input type="file">
                </label>
                <label>
                  Input your age (years):
                  <input type="number" min="13" max="120">
                </label>
                <label>
How did you hear about us?
                                <select>
                  <option value="">(select one)</option>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>
                                    </option>
                </select>
                </label>
                       <label for="bio"> 
                Provide a bio:
                                <textarea id="bio" name="bio" rows="3" cols="30"> 
                                  </textarea>
              </label>
                     </fieldset>
                                      <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/" target="_blank"> terms and conditions</a>
      </label>
      <label>
      <input type="submit" value="Submit" />
      </label>           
    </form>
  </body>
</html>

Hi Marvin. You have put the new elements in the right place and the syntax is ok but you are adding a lot of attributes to your elements that are not asked for.

Look at the spacing after your bio text as well against the instructions.

<label for="bio"> 
                Provide a bio:
                                <textarea id="bio" name="bio" rows="3" cols="30"> 
                                  </textarea>
              </label>

hi. well using visual studio code and then copying an pasting, as then have to go into forms mode to then get to the editor or have to turn forums mode off. so is it the spacing, why is it not liking it. so how to fix. be gentle with me. trying my best. is it the spacing. did hear my screen reader jaws and the content hears right and it is the correct code. so, what am i doing wrong and how to get this to work. so if the code is correct. need the extra stuff, as previous steps, to then get it to pass and then adds. if i remove the other stuff from the editor it will then complain. so how to get this to work. why? can you explain and then talk me through how to get this to pass or what to do. trying my best as a screen reader user, and sometimes dont understand what the error message. should have better descriptions for screen reader users.
marvin.

I have just tried your code and it will work by just removing the attributes you added from the textarea element. Have you tried removing the attributes?

Don’t worry about the spacing, that doesn’t seem to be a problem.

hi. no have not tried that yet. was having dinner, here in adelaide, having a coffee, lsitening to sport, having a shower. so just back on the computer. okay will try to then remove the other stuff from after the text area. if not, then really stuck. is that what i should do. please advice, before i try that.
marvin.

hi. tried that in the editor. and this is the message i get.
hi. so how to fix. this is stupid. is the opening and closing tags. they are there. this is driving me nuts.
so why? if it ran with your code, why not mine. what am i missing. is the text area the issue. do i then need to then delete and then just type up that code again.
frustrated.
marvin.You should give the textarea element opening and closing tags.

hi. got it working, had just to go with textarea. wish they would make it more obvious to screen reader users. so it works.
sorry.
marvin.
ps: move on to the next step until i ran into the next issue and then see to see if i then google how to fix.
.

<!DOCTYPE html>
<html>
<head>
  <title>Login - My Company</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div class="login-box">
    <h2>Login</h2>
    <form action="company.html" method="get">
      <label for="username">Username</label>
      <input type="text" id="username" required>

      <label for="password">Password</label>
      <input type="password" id="password" required>

      <button type="submit">Login</button>
    </form>
  </div>
</body>
</html>

Add a textarea element inside the label element. Note that the textarea requires a closing tag.

Why did you add id, bio, rows and cols attributes to your textarea?

You need to follow the instructions exactly. Don’t add anything extra. The tests cannot account for every variation that someone might type in, so they can’t always tell you exactly what the problem is.

In this case, the hint seemed mis-leading (about opening and closing tags) because it never expected you to add these attributes.

In fact, what you’ve added is asked for in a future step, step 35 and further. It seems like you copied this code from a step later on?

hi. still not liking it. and not sure why. so will paste the error and my code from the editor. how to get this to fix. can you try on your end. so dont know why it is doing this. so whats the correct code to get this to work adn how to fix it. frustrated.
marvin.
ps: pasting below.

The first input element should have an id of profile-picture .

type or paste code here
<!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 method="post" 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>
        <legend>Account type (required)</legend>
        <label for="personal-account"> 
          <input id="personal-account" type="radio" name="account-type" checked />
           Personal 
          </label>
        <label for="business-account"> 
          <input id="business-account" type="radio" name="account-type" />
           Business 
          </label>
      </fieldset>
      <fieldset> 
        <label> 
          Upload a profile picture:
                <input type="file">
                </label>
                <label>
                  Input your age (years):
                  <input type="number" min="13" max="120">
                </label>
                <label>
How did you hear about us?
                                <select>
                  <option value="">(select one)</option>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>
                                    </option>
                </select>
                </label>
                       <label for="bio"> 
                Provide a bio:
                                <textarea> 
                                  </textarea>
              </label>
                     </fieldset>
                     <fieldset>
                     <label for="profile-picture"> 
                      Upload a profile picture:
                      <input type="file" id="profile-picture" name="profile-picture">
                                                                 </label>
                     <label for="age"> 
                      Enter your age:
                      <input type="number" id="age" name="age">
                     </label>
                     <label for="referrer"> 
                      How did you hear about us?
                      </label>
                      <select id="referrer" name="referrer">
                        <option value="">Select one</option>
                        <option value="friend">Friend</option>
                        <option value="advertisement">Advertisement</option>
                        <option value="social-media">Social Media</option>
                      </select>
                                          </fieldset>
                                      <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/" target="_blank"> terms and conditions</a>
      </label>
      <label>
      <input type="submit" value="Submit" />
      </label>           
    </form>
  </body>
</html>

hi.no just trying to follow the steps. so trying to get my file upload to work. dont know whats going on. frustrated. so what to do. so are you saying to take other parts out, if i do that, will that break the form in the editor and then other problems. help me out, and tell me what to do and how to fix this.
marvin.
ps: so totally stumped and totally frustrated. just trying to then put in the code the steps suggest and used google for hwo to do some of the steps, not sure.
marvin.

that code is correct, are you having issues with it?

Marvin I think you have posted your issue with step 34 in the thread for step 33. You confirmed earlier on in the thread that you got step 33 working. Remember to post inside the correct thread for the step you are on.

hi it was step 34. sorry. now it is working.
so now got and issue with my stylesheet which i have posted and waiting for help.
marvin.