JSFiddle - React, Tailwind, and code Playground

HTML

<div class="example">
            <div>
              Box one
            </div> 
            <div class="center">
              center
            </div> 
            <div>
              Box two
            </div> 
</div>

CSS

.example {
height: 260px;
display: -webkit-box;
-webkit-box-orient: horizontal;
display: -moz-box;
-moz-box-orient: horizontal;
    width:100%;
}
.example div{
background: green;
padding: 10px;
-webkit-box-flex: 1;
-moz-box-flex: 1;
text-align: center;
}
.example div + div{
    background: red;
}
.example .center{
    background:yellow;
    width:400px;
}