JSFiddle - React, Tailwind, and code Playground

HTML

<div class="second_bar">
        <div class="status_border_left">
        </div><div class="nav_bar">test
        </div><div class="status_border_right">
        </div>
    </div>

CSS

.status_bar{
    min-width:980px;
    height:41px;
    width:100%;
    background-color:#3a2c31;
}
.status_border_left{
    float: left;
    width:10%;
    height:14px;
    background-color:yellow;
}
.status_border_right{
    float: right;
    width:10%;
    height:14px;
    background-color:yellow;
}
.nav_bar{
    position:relative;
    margin: 0 auto;
    height:80px;
    width: 80%;
    background-color:green;
}
.second_bar *{
    display:inline-block;
    vertical-align:top;
}
.second_bar{
    height:80px;
    width:100%;
}