JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper" align="center">
    <div id="wrapper_inner">
        <div id="headerContainer"></div>
            <div id="bodyContainer">
                <div id="leftColumn"></div>
                <div id="rightColumn"></div>
            </div>
        <div id="footerContainer"></div>
    </div>
</div>

CSS

#wrapper{
    width: 100%;
    }

 #wrapper_inner{
     width:800px;
     height:200px;
}

 #headerContainer{
     width:800px;
     height:200px;
     background-color: red;
}

 #bodyContainer{
    width:800px;
    height:200px;
    background-color: grey;
    overflow:hidden;
    position:relative;
}

 #leftColumn{
width: 395px;
height: 400px;
float: left;
background-color: green;
}

 #rightColumn{
width: 395px;
height: 400px;
float: right;
background-color: orange;
}

 #footerContainer{
     width:800px;
     height:200px;
     background-color: black;
}



/*width: 465px; 
height: 455px;*/