Edit in JSFiddle

.wrap {
    background: #cdf;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.centered {
    background: #ffa;
    max-width: 50%;
}

<div class="wrap">
    <div class="centered">
        <h3>centered block</h3>
        <p>this block does not have height specified</p>
        <p>max width specified as 50% of parent element</p>
        <p>parent element have height specified 100vh = 100% of the viewport</p>
    </div>
</div>