Learn HTML Forms by Building a Registration Form - Step 28

HTML-CSS
1

Tell us what’s happening:

I cant solve this. I dont know what actually wrong in my code. can somebody help!!

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

<!-- User Editable Region -->

      <fieldset>
        <legend (required)>
          Account type
          </legend>
        <label ><input type="radio" name="account-type" Checked  />  Personal</label>
        <label><input type="radio" name="account-type" /> Business</label>
      </fieldset>

<!-- User Editable Region -->

      <fieldset></fieldset>
      <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 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36

Challenge Information:

Learn HTML Forms by Building a Registration Form - Step 28

1 Like
2

Hi Hasanul

So your code is incorrect because the required is contained within brackets within your legend tag, this is incorrect. You need a string of code with the text Account type (required) which is contained within your legend tag. So…

<legend> Account type (required) </legend>

It is then asking us to make it so that we have to select one of the radio option buttons. For texrt inputs like in our code above we would use the required attribute within the label element. However for radio inputs and check boxes we use the “Checked” attribute so your code should look like this…

        <label><input type="radio" name="account-type" checked /> Personal</label>
        <label><input type="radio" name="account-type" /> Business</label>

So we do this for only one option as this means one is always selected meaning the user will have to choose an option like the required attribute, but in the checked it will pre-select an option you have added the checked attriburte value to.

Hope this helps!

1 Like
3

I think your confusion comes from the fact the word required in the text Account type (required). This required has no effect or affect on your HTML, this is just the string of text you would like displayed as the legend and it so happens to have the text (required) in it

1 Like
4

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