JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
<html>
<head>
<meta charset=utf-8>
<title>Лабораторная 2.3</title>
<link rel=stylesheet href=3.css>
</head>
  <body>
                <div id=wrap>
                        <header>Верхний блок</header>
                           <div id="main">  
                            <nav>Навигация<br>Навигация<br>Навигация</nav>
                            <article>
                            <p>Таким образом новая модель организационной деятельности представляет собой интересный
                            эксперимент проверки форм развития. Товарищи! новая модель организационной деятельности
                            способствует подготовки и реализации существенных финансовых и административных условий.
                            Разнообразный и богатый опыт постоянное информационно-пропагандистское обеспечение нашей
                            деятельности представляет собой интересный эксперимент проверки дальнейших направлений развития.</p>
                            <p>Таким образом новая модель организационной деятельности представляет собой интересный
                            эксперимент проверки форм развития. Товарищи! новая модель организационной деятельности
                            способствует подготовки и реализации существенных финансовых и административных условий.
                            Разнообразный и богатый опыт постоянное информационно-пропагандистское обеспечение нашей
                            деятельности представляет собой интересный эксперимент проверки дальнейших направлений развития.</p>
                       
                            </article>
                            <aside>Aside<br>Разделы<br>Архивы</aside>
                      </div>
                </div>
                <footer>Нижний блок</footer>
  </body>

</html>

CSS

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

#wrap { min-height: 100%; margin: 0 auto; width: 700px; background: #eeeeee;}
#main{
    overflow:hidden;
    padding:0 0 60px;
}
header{
background: #f65a4f;
height: 60px;
}
nav{
background: #fad923;
float: left;
width: 20%;
}
article{
background: #04b4d7;
float:left;
width: 55%;
}
aside{
background: #fad923;
float: right;
width: 25%;
}
footer{
background: #56b650;
position: relative;
margin-top: -60px;
height: 60px;
width: 100%;
clear: both;
}