html css center text on page

1.parent {
2  display: flex;
3  justify-content: center;
4  align-items: center;
5}

1<style>
2body { background: white }
3section {
4  background: black;
5  color: white;
6  border-radius: 1em;
7  padding: 1em;
8  position: absolute;
9  top: 50%;
10  left: 50%;
11  margin-right: -50%;
12  transform: translate(-50%, -50%)
13  }
14</style>
15
16<section>
17  <h1>Nicely centered</h1>
18  <p>This text block is vertically centered.
19  <p>Horizontally, too, if the window is wide enough.
20</section>

1body{
2  display: grid;
3  place-items: center;
4}