JSFiddle - React, Tailwind, and code Playground

HTML

<div id="main-container">
    <div id="headbody"></div>
    <div id="menu-midddle"></div>
</div>

CSS

#main-container {
    width: 1000px;
    height: 2200px;
    background-color: #FFFFFF;
    margin: 0px auto;
    top: 0px;
    position:relative;
    border-style:solid;
    border-width:1px;
    border-color:#dfe3ee;
}
#headbody {
    width:1000px;
    height:45px;
    border-style:solid;
    border-width:1px;
    border-color:#588039;
    background-color: #588039;
    margin: 0px auto;
    position: fixed;
    z-index: 2;
    top:0;
}
#menu-middle {
    width:1000px;
    height:45px;
    border-style:solid;
    border-width:1px;
    border-color:#588039;
    background-color: #588039;
    margin: 0px auto;
    position: fixed;
    z-index: 2;
    top:0;
}
#main-container {
    width: 1000px;
    height: 2200px;
    background-color: #FFFFFF;
    margin: 0px auto;
    top: 0px;
    position:relative;
    border-style:solid;
    border-width:1px;
    border-color:#dfe3ee;
}