Files
freeCodeCamp/curriculum/challenges/english/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60f852f645b5310a8264f555.md
Naomi Carrigan 16e7cdedb1 feat: migrate filenames to IDs (#45146)
* feat: migrate filenames to IDs

* feat: migrate balance sheet file names

* revert: no id name for cert projects

* fix: i swear i know what i'm doing
2022-03-02 09:06:00 -06:00

1.7 KiB

id, title, challengeType, dashedName
id title challengeType dashedName
60f852f645b5310a8264f555 Step 21 0 step-21

--description--

Let us go to the next part of the registration form. This section will ask for the type of account the user is opening, and will confirm the user has read the terms and conditions.

Start by adding three label elements to the second fieldset.

--hints--

You should add three label elements to the second fieldset.

assert.equal(document.querySelectorAll('fieldset')?.[1]?.querySelectorAll('label')?.length, 3);

The label elements should be siblings.

assert.exists(document.querySelector('fieldset:nth-child(2)')?.querySelector('label + label + label'));

--seed--

--seed-contents--

<!DOCTYPE html>
<html>
  <head>
    <title>freeCodeCamp Registration Form Project</title>
	  <link rel="stylesheet" type="text/css" href="styles.css" />
  </head>
  <body>
    <h1>Registration Form</h1>
    <p>Please fill out this form with the required information</p>
    <form action='https://fcc-registration-form.com'>
      <fieldset>
        <label>Enter Your First Name: <input type="text" required /></label>
        <label>Enter Your Last Name: <input type="text" required /></label>
        <label>Enter Your Email: <input type="email" required /></label>
        <label>Create a New Password: <input type="password" pattern="[a-z0-5]{8,}" required /></label>
      </fieldset>
--fcc-editable-region--
      <fieldset>

      </fieldset>
--fcc-editable-region--
      <fieldset></fieldset>
      <input type="submit" value="Submit" />
    </form>
  </body>
</html>
body {
  width: 100%;
  height: 100vh;
  margin: 0;
  background-color: #1b1b32;
	color: #f5f6f7;
}

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