JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="block"></div>
</div>

CSS

html, body, .container {
    margin: 0;
    height: 100%;
}

.container {
    text-align: center;
    white-space: nowrap;
}

.container:before {
    content: '';
    width: 0;
    height: 100%;
    display: inline-block;
    vertical-align: middle;
}

.block {
    display: inline-block;
    vertical-align: middle;
    white-space: normal;
    font: 48px/1.4 Arial, sans-serif;
    color: #446EA7;
}

JavaScript

[
    '<table><tr><td>Hello, world</td></tr><tr><td>Hello, krkm</td></tr></table>',
 	'Hello, world. Hello, krkm. Hello, world. Hello, krkm. Hello, world. Hello, krkm Hello, world. Hello, krkm',
 	'Hello, world<br/>Hello, krkm'
].forEach(function(v,i){
    setTimeout(function(){
        document.getElementsByClassName('block')[0].innerHTML = v;
    },i*3000)
});