JSFiddle - React, Tailwind, and code Playground

HTML

<body>

<div id="wrapper">

    <header id="header">     
    </header> 


    <section id="middle">

        <div id="container">
            <div id="content">
                Content
            </div>
        </div><!-- #container-->

        <aside id="sideLeft">
            Content Left
        </aside>

        <aside id="sideRight">
            Content Right
        </aside>

    </section>

</div><!-- #wrapper -->

<footer id="footer">
   
</footer>

</body>

CSS

*{
    margin:0;
    padding:0;
}
html{
    height:100%;
    background:#fff;    
}
header, nav, section, article, aside, footer {
    display:block;
}
body{
    font:12px/18px Arial, Tahoma, Verdana, sans-serif;
    width:100%;
    height:100%;    
}
#wrapper{    
    width:1000px;
    margin:0 auto;
    min-height:100%;
    height:auto !important;
    height:100%;
    border:1px solid #b4b0b0;
    border-bottom:none; 
}
#header{
    position:relative;
    height:155px;
}

#middle{    
    width:100%;
    padding:0 0 30px;
    height:1%;
    position:relative;
}
#middle:after{    
    content:'.';
    display:block;
    clear:both;
    visibility:hidden;
    height:0;
}
#container{
    width:100%;
    float:left;
    overflow:hidden;
}
#content{
    padding:0 270px 0 220px;
}
#sideLeft{
    float:left;
    width:199px;
    margin-left:-100%;
    position:relative;
    border-right:1px solid #b4b0b0;
}
#sideRight{
    float:left;
    margin:0 -3px 0 -264px;
    width:264px;
    position:relative;
    border-left:1px solid #b4b0b0;
}
#footer{
    padding-top:15px;
    width:1000px;
    margin:-50px auto 0;
    height:30px;
    border-top:1px solid #b4b0b0;
    position:relative;
    overflow:hidden;
}