center horizontally and vertically paragraph inside div - css

Question

how i can center horizontally and vertically the paragraph inside the div , i came to this result
.Benefits {
min-height: 20%;
width: 100%;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}
<section class="Benefits">
<div>
<h1>Lorem ipsum </h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis nemo quas dolor optio autem! Veniam, dolore neque nam harum quae excepturi distinctio optio explicabo ipsum laudantium nesciunt et autem a.</p>
</div>
<div>
<h1>Lorem ipsum n</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis nemo quas dolor optio autem! Veniam, dolore neque nam harum quae excepturi distinctio optio explicabo ipsum laudantium nesciunt et autem a.</p>
</div>
<div>
<h1>Lorem ipsum </h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis nemo quas dolor optio autem! Veniam, dolore neque nam harum quae excepturi distinctio optio explicabo ipsum laudantium nesciunt et autem a.</p>
</div>
</section>

Answer 1

.Benefits div {
min-height: 20%;
margin: auto;
width: 50%;
}
<section class="Benefits">
<div>
<h1>Lorem ipsum </h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis nemo quas dolor optio autem! Veniam, dolore neque nam harum quae excepturi distinctio optio explicabo ipsum laudantium nesciunt et autem a.</p>
</div>
<div>
<h1>Lorem ipsum n</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis nemo quas dolor optio autem! Veniam, dolore neque nam harum quae excepturi distinctio optio explicabo ipsum laudantium nesciunt et autem a.</p>
</div>
<div>
<h1>Lorem ipsum </h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis nemo quas dolor optio autem! Veniam, dolore neque nam harum quae excepturi distinctio optio explicabo ipsum laudantium nesciunt et autem a.</p>
</div>
</section>

Answer 2

I have noted in my CSS what's going on here:
I think you're best using two cases of display: flex. One horizontally, one vertically.
.Benefits {
width: 100%;
max-width: 1248px;
margin: 0 auto; /* centers container */
padding: 10px; /* this combined with the margin in the divs will make the margins appear consistent */
box-sizing: border-box;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
flex-direction: row; /* sort into rows */
align-items: center;
justify-content: space-between;
text-align: center;
}
.Benefits div {
width: calc((100% / 3) - 20px); /* calculate width for maximum accuracy | minus margin */
margin: 10px; /* space between boxes */
padding: 20px; /* space inside boxes */
box-sizing: border-box; /* calculates border and padding in width */
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
flex-direction: column; /* sort into columns */
align-items: center;
justify-content: center;
flex-grow: 1; /* forces singular div that falls beneath to be full width */
background-color: rgba(0,0,0,0.25);
}
#media screen and (min-width: 640px) and (max-width: 1023px) {
.Benefits div {
width: calc((100% / 2) - 20px); /* calculate width for maximum accuracy | minus margin */
}
}
#media screen and (max-width: 639px) {
.Benefits div {
width: 100%; /* calculate width for maximum accuracy | minus margin */
}
}
.Benefits div h1 {
margin-bottom: 20px;
}
<section class="Benefits">
<div>
<h1>Lorem ipsum </h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis nemo quas dolor optio autem! Veniam, dolore neque nam harum quae excepturi distinctio optio explicabo ipsum laudantium nesciunt et autem a.</p>
</div>
<div>
<h1>Lorem ipsum n</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis nemo quas dolor optio autem! Veniam, dolore neque nam harum quae excepturi distinctio optio explicabo ipsum laudantium nesciunt et autem a.</p>
</div>
<div>
<h1>Lorem ipsum </h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis nemo quas dolor optio autem! Veniam, dolore neque nam harum quae excepturi distinctio optio explicabo ipsum laudantium nesciunt et autem a.</p>
</div>
</section>