Quick Tip: The Simplest Way To Center Elements Vertically And Horizontally (https://tutorialzine.com/2015/09/quick-tip-the-simplest-way-to-center-elements-vertically-and-horizontally)

center_element.css

*{
    margin: 0;
    padding: 0;
}

body, html{
    height: 100%;
}

.container{
    display: flex;
    align-items: center;
    justify-content: center;

    height: 100%;
}

.container p{
    max-width: 50%;
    padding: 15px;
    background-color: #f1f1f1;
}

center_element.html

<div class="container">
    <!--// Any content in here will be centered.-->
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam dapibus, eros et aliquam volutpat, ante tellus bibendum justo, et mollis orci velit ut odio. Maecenas sagittis mi velit, sit amet varius lorem ornare in. Sed dapibus turpis vel nunc finibus cursus. Nunc erat purus, sodales sit amet neque et, aliquam pretium felis. Mauris eros est, elementum eu eros ut, feugiat fermentum metus. In hac habitasse platea dictumst. Integer tristique semper semper. Etiam quis ligula sit amet ipsum condimentum euismod. Praesent iaculis ante et magna suscipit vulputate. Curabitur vitae porttitor erat. Vivamus vel blandit tellus, ut sollicitudin metus.</p>
</div>