<div class="incenter">
  
  <p>This piece of texts is both horizontally and vertically centered.  Vertical centering is done using line height. Test this by reducing the screen size, or watching it on a mobile device. </p>
  
</div>

.incenter {
    background: lightgrey;
    width: 65%;
    line-height: 220px;
    height: 220px;
    margin: 30px auto;
    border: 2px inset indigo;
    text-align: center;
    font-family: montserrat;
    font-size: medium;
    padding: 0 40px;
    letter-spacing: .01em;
    color: indigo;
}

/* In case the text has multiple lines, add the following: */
.incenter p {
    line-height: 1.5;
    display: inline-block;
    vertical-align: middle;
    text-align: justify; /* Omit this if you wish */
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.