Learn HTML Forms by Building a Registration Form - Step 31

HTML-CSS
1

I still get wrong this step, I have changed the “I accept the” outside the a element and put the rest inside the a element and liked but still does not pass.

See the response

You should add I accept the terms and conditions text to the label following the third fieldset.

<!-- 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">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></fieldset>

<!-- User Editable Region -->

     <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>

<!-- User Editable Region -->

      <input type="submit" value="Submit" />
    </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 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.5.2 Safari/605.1.15

Challenge Information:

Learn HTML Forms by Building a Registration Form - Step 31

2

Two things:

  • You added an period (dot) at then end of the text you added. It’s a small thing, but the instructions didn’t ask for it, so you’ll need to remove it if you want to pass.
  • Make sure there is a space between every word in the text you added. It might be hard to see if the color of the link doesn’t have enough contrast with the black background, but you are missing one space.
1 Like
3

I did now I removed the small dot and gave a space to the text, but I get this answer:
You should only wrap the a element around the text terms and conditions .

4

You’ll need to paste in your updated code so we can see exactly what you did.

5

oh sorry:

I don’t know how to past it, I copy and paste once but it does not show it

<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>
6

Ahh, sorry, I usually include information on how to paste in your code here so we can see it, but I forgot. Here it is.

To display your code in here you need to wrap it in triple back ticks. On a line by itself type three back ticks. Then on the first line below the three back ticks paste in your code. Then below your code on a new line type three more back ticks. The back tick on my keyboard is in the upper left just above the Tab key and below the Esc key. You may also be able to use Ctrl+e to automatically give you the triple back ticks while you are typing in the this editor and the cursor is on a line by itself. Alternatively, with the cursor on a line by itself, you can use the </> button above the editor to add the triple back ticks.

1 Like
7

Just get rid of that extra space between the opening a tag and the word “terms” and you should be good to go. In general, you should not add extra spaces inside of an anchor tag. The test usually don’t like that.

1 Like
8

thank you so much it worked!!! I am so happy :grinning:

2 Likes
9

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