Learn HTML Forms by Building a Registration Form - Step 38

Tell us what’s happening:
Describe your issue in detail here.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <title>Registration Form</title>
    <link rel="stylesheet" href="styles.css" />
    <h1>Registration Form</h1>
    <p>Please fill out this form with the required information</p>
    <form method="post" action='https://register-demo.freecodecamp.org'>
        <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>
        <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>

<!-- User Editable Region -->

        <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?
            <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>
        <label>Provide a bio:
        <label for="profile-picture">Profile Picture: <input type="file" id="profile-picture"></label>
        <label for="age"> Age: <input type="number" id="age"></label>
        <label for="reference"> Refrence: <input type="text" id="preference"></label>

<!-- User Editable Region -->

      <input type="submit" value="Submit" />
/* 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/ Safari/537.36

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

Link to the challenge:

Please Tell us what’s happening in your own words.

Learning to describe problems is hard, but it is an important part of learning how to code.

Also, the more you say, the more we can help!

The first input element should have an id of profile-picture . it says like this

The applicable elements are: two input elements, select element, and textarea element:
As you can see, the first input element with the ‘type’ attribute set to the value of “file”, should have an id set to the value of “profile-picture” (‘Choose file’ on the screenshot), the second input element with the ‘type’ attribute set to the value of “number” should have an id set to the value of “age”, the ‘select’ element should have an id set to the value of “referrer”, and the ‘textarea’ element should have an id set to the value of “bio”.
Each element mentioned above, is wrapped in its ‘label’ element that must have the ‘for’ attribute added into the opening <label> tag, and set to the same value as corresponding id attribute.

<label for="profile-picture">Profile Picture: <input type="file" id="profile-picture"></label>
    <label for="age">Age: <input type="number" id="age"></label>
    <label for="referrer">Referrer: <input type="text" id="referrer"></label>
    <label for="bio">Bio: <textarea id="bio"></textarea></label>

what is wrong with my this code?

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 (').

dude you are not help so bye

Your code was not showing up. So he was showing how to enter code into the forum so we can actually see what you are doing. Which is pretty helpful

Was there something in the previous explanation that we can try to make more clear, or something you are not sure on? The more you let us know then the more we can explain

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.