JSFiddle - React, Tailwind, and code Playground

HTML

<div class="page">
    <div class="header">header</div>
    <div class="menu">menu</div>
    <div class="content">
        <p>По несчастью или к счастью,<br>
        Истина проста:<br>
        Никогда не возвращайся<br>
        В прежние места.</p>

        <p>Даже если пепелище<br>
        Выглядит вполне,<br>
        Не найти того, что ищем,<br>
        Ни тебе, ни мне.</p>

        <p>Путешествие в обратно<br>
        Я бы запретил,<br>
        Я прошу тебя, как брата,<br>
        Душу не мути.</p>
    </div>
</div>

CSS

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

.page {
    display: table;
    width: 100%;
}

.header {
    display: table-row;
    
    height: 100px;
    
    background: #777;
}

.menu {
    display: table-row;
    
    height: 50px;
    
    background: #999;
}

.content {
    display: table-cell;
    
    height: 100%;
    
    padding: 10px 20px;
    
    background: #ccc;
}