JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outer">
    <div class="inner">
        <div>
            <p>Wow, alles hier ist zentriert! Wow, alles hier ist zentriert! Wow, alles hier ist zentriert! Wow, alles hier ist zentriert! Wow, alles hier ist zentriert! Wow, alles hier ist zentriert!
            </p>
        </div>
    </div>
</div>

CSS

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html, body, .outer, .inner {
    width: 100%;
    height: 100%;
}

.outer {
    display: table;
}

.inner {
    display: table-cell;
    vertical-align: middle;
    padding: 20px;
}

.inner > div {
    width: 50%;
    margin: 0px auto;
    padding: 10px;
    background: #eee;
}