JSFiddle - React, Tailwind, and code Playground

HTML

<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title>Символика</title>
        <meta http-equiv="Content-Type" content="text/html;  charset=windows-1251">
        <link rel="stylesheet" type="text/css" href="style.css">
    </head>
    <body>
        <div class="wrapper">
            <div id="header">заголовок</div>
            <div id="hor_menu">горизонтальное меню</div>
            <div id="left">левый див</div>
            <div id="right">правый див</div>      
            <div id="data">данные</div>
            <div id="footer">подвал</div>
        </div>
    </body>
</html>

CSS

.wrapper {
    width: 70%;
    margin: 0 auto;
}

#header{
    height: 100px;
    background-color: red;
}


#hor_menu{
    height: 100px;
    background-color: aquamarine;
}


#left{
    width: 20%;
    height: 500px;
    float: left;
    background-color: yellow;
}


#right{
    width: 20%;
    height: 500px;
    float: right;
    background-color: yellow;
}


#data{
    margin-left: 20%;
    margin-right: 20%;
    height: 500px;
    background: yellowgreen;
    
}

#footer{
    height: 100px;
    background-color: red;
    clear: both;
}