Login

<style>
.flex {
  display: flex;
  justify-content: center;
  margin-top: 3em;
  margin-bottom: 3em;
}
.login {
  padding: 1em;
  border: 3px solid gray;
  border-radius: 1em;
  background-color: plum;
}
form {
  text-align: right;
}
.title {
  font-size: large;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1em;
}
button {
  margin-top: 1em;
}
</style>

<body>
<div class="flex">
  <div class="login">
    <div class="title">Login</div>
      <form action="sample.php" method="post">
        <div>
          <label for="name">アカウント名 : </label>
            <input type="text" id="name" name="name" required autofocus>
        </div>
        <div>
          <label for="mail">メールアドレス : </label>
            <input type="email" id="mail" name="mail" required>
        </div>
        <div>
          <button type="submit">登録</button>
        </div>
      </form>
  </div>
</div>
</body>