index.html

<!DOCTYPE html>

<head>
  <title>Registration Form with User Entries</title>
</head>
<style>
  .container {
    width: 500px;
    height: 300px;
    border-radius: 7px;
    background-color: rgb(126, 120, 112);
    border: 1px solid firebrick;
    font-family: calibri;
    font-size: 120%;
    font-weight: bolder;
    box-shadow: 6px 6px 30px rgb(145, 135, 156);
  }

  #title {
    background-color: rgb(2, 1, 1);
    color: white;
    border: 1px solid rgb(146, 87, 87);
    padding-bottom: -1px;
    height: 28px;
    border-radius: 3px;
  }

  input#name,
  input#email,
  input#password,
  input#dob {
    height: 20px;
    width: 100%;
  }

  #submit {
    background-color: red;
    border: 2px solid black;
    height: 30px;
    width: 100%;
    color: white;
    /* border: none; */
    border-radius: 10px;
    font-size: 105%;
    margin-top: 10px;
    cursor: pointer;
  }
  #name ,#email,#password,#dob{
    border-radius: 7px;
  }
</style>

<body bgcolor="#999">
  <center>
    <form id="user-form">
      <fieldset class="container">
        <legend id="title">Registration Form</legend>
        <table cellspacing="5" cellpadding="5">
          <tr>
            <td><label for="name">Name </label></td>
            <td><input type="text" id="name" name="nm" required /></td>
          </tr>
          <tr>
            <td><label for="email">Email ID </label></td>
            <td><input type="email" id="email" name="em" required /></td>
          </tr>
          <tr>
            <td><label for="password">Password </label></td>
            <td>
              <input type="password" id="password" name="pass" required />
            </td>
          </tr>
          <tr>
            <td><label for="dob">Date Of Birth </label></td>
            <td><input type="date" id="dob" name="DOB" required /></td>
          </tr>
          <tr>
            <td align="right">
              <input type="checkbox" id="acceptTerms" name="accept" />
            </td>
            <td><label for="acceptTerms">accept Terms & Conditions</label></td>
          </tr>
          <tr>
            <td colspan="2" align="center">
              <button type="submit" id="submit">Submit</button>
            </td>
          </tr>
        </table>
      </fieldset>
    </form>
    <h2>User Entries</h2>
    <div id="user-entries"></div>
  </center>
  <script type="text/javascript" src="registration.js"></script>
</body>