Project 18: Registration Flow

HTML Masterclass

Builds on these lessons

Checkboxes Radios Input Checkbox Input Radio Form Validation Forms Validation Api Forms Constraint Validation Forms Custom Validation Forms Pattern Attribute

Step 1 of 4

Project

Account Type with Radio Buttons

Add a <fieldset><legend>Account Type</legend> containing two radio inputs — Personal and Business. Give both the same name="accountType" so the browser treats them as one mutually-exclusive group; only one can ever be checked.

🎯 Your Task

Please add the exact code shown in the light gray box below to your editor.Do not delete your previous code, just insert these new lines in the correct place!

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Create Account | Nimbus Labs</title>
</head>
<body>
  <h1>Create Account</h1>
  <form action="/register" method="POST">
    <fieldset>
      <legend>Account Type</legend>
      <label><input type="radio" name="accountType" value="personal" checked> Personal</label>
      <label><input type="radio" name="accountType" value="business"> Business</label>
    </fieldset>
  </form>
</body>
</html>

← Previous Next →