How do we make the contents of the CSS centre?

[Kadyn]

There's a raw form of authorization, how do you make her contents in the center of the block?

.header {
  background-color: white;
  color: black;
  height: 90%;
  margin: 5%;
  border-radius: 10px;
  text-align: center;
  font-family: "Times New Roman", Georgia, Serif;
}

<div class="login">
<h3>LOG IN</h3>
<p>

<input name="mail" type="mail" />

</p>
<p>

<input name="password" type="password" />

</p>
<p>

<input name="button" type="button" />

</p>
</div>

[jonetta]

.header {
  background-color: white;
  color: black;
  height: 90%;
  margin: 5%;
  border-radius: 10px;
  text-align: center;
  font-family: "Times New Roman", Georgia, Serif;
}
p input{text-align:center;margin:0px auto; padding:0px;}

<div class="login">
<h3>LOG IN</h3>
<p>

<input name="mail" type="mail"/>

</p>
<p>

<input name="password" type="password"/>

</p>
<p>

<input name="button" type="button"/>

</p>
</div>