JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <div id="pagewrap">    
        <header>
            
            <h1><a href="/">Название</a></h1>  
            
        </header>
        
        <nav>
            <ul>
                <li><a href="/chapter-one">Глава первая</a>
                <li><a href="/chapter-two">Глава вторая</a>
                <li><a href="/chapter-three">Глава третья</a>
            </ul>
        </nav>
        
        <div class="page-body">
            <article><p>Контент</p></article>
            <aside>Боковая колонка</aside>
        </div>
        
        <footer>Подвал</footer>
    </div>
    </body>

CSS

* {
	margin: 0;
	padding: 0;
}

body {
    
    font-family: "Arial",sans-serif,arial;
    background: #eee;
    
}

#pagewrap {
    
    margin: 0 auto;
    width: 80%;
    max-width: 1100px;
    
}

header {
    
    height: 120px;
    background: red;
    
}

nav {
    
    width: 100%;
    background: yellow;
}

nav > ul > li {
    
    display: inline-block;
    height: 55px;
    
}

.page-body {
    

    
}

article {
    
    width: 70%;
    background: green;
    float: left;
    
}

aside {
    
    width: 30%;
    background: pink;
    float: right;
    
}


footer {
    
    width: 100%;
    height: 90px;
    background: grey;
}