Learn HTML Forms by Building a Registration Form - Step 17

HTML-CSS
1

Tell us what’s happening:

You should add the first input after the label text Enter Your First Name:, and include a space after the colon.

Your code so far

<!-- 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 method="post" action='https://register-demo.freecodecamp.org'>

<!-- User Editable Region -->

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

<!-- User Editable Region -->

      <fieldset></fieldset>
      <fieldset></fieldset>
    </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/127.0.0.0 Safari/537.36

Challenge Information:

Learn HTML Forms by Building a Registration Form - Step 17

2

Welcome to our community!

The instructions: " Nest an input element within each label . Be sure to add each input after the label text, and include a space after the colon."

According to the instructions after the opening <label> tag and the text that follows you should add the <input> element (without any text inside its tag). After the ‘input’ element add the closing </label> tag. Do the same for all four code lines in this challenge.

3

Welcome to the forum @praveensagar

Here is a comparison of the original code and your code.

The code in blue is the original code, the code in red is your code.
The code in magenta is the overlap.

image
image786×386 31.3 KB

You appear to have placed the label text inside the input element.
However, the new label text is altered.

Please reset the step to restore the seed code and try again.

Happy coding