Learn HTML Forms by Building a Registration Form - Step 17

HTML-CSS
1

Tell us what’s happening:

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

HELP! I feel like I’m close to solution but at the same time not.

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'>
      <fieldset>
        <label for="first-name"><input id="first-name"/>Enter Your First Name:</label>
        <label for="last-name"><input id="last-name"/> Enter Your Last Name:</label>
        <label for="email"><input id="email">Email:</label>
        <label for="new-password"><input id="new-password">New Password:</label>
      </fieldset>
      <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; rv:106.0) Gecko/20100101 Firefox/106.0

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

Link to the challenge:

2

You are super close. It’s really just a matter of placement.

this is what you have for.
<label for="first-name"><input id="first-name"/>Enter Your First Name:</label>

but the instructions want you to do it like this:
mod edit : solution redacted

you just need to place the input elements after the text that you use for the label, but before the closing tag of the label, for each nested input element.

3

hi there Vinyl704,

It is our policy not to type out solutions to fCC challenges when someone asks for help because we believe that providing a hint/tip or other types of guidance is better for the learner’s overall success. (I see you have attempted this, and if that tip is not enough, feel free to provide additional guidance without an outright typing out of a solution)

Thanks for your understanding

4 
  <fieldset>
        <label for="first-name">Enter Your First Name:</label><input id="first-name"/>
        <label for="last name">Enter Your Last Name:</label><input id="last-name"/>
        <label for="email">Enter Your Email:</label><input id="email"/>
        <label for="new password">Enter Your New Password:</label><input id="new password"/>
      </fieldset>

Still stuck on this…

5

the input element is still in the wrong place…

please re-read the comment from vinyl704 above

6

Omg, just got it.

:rofl:

1 Like
7

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