JSFiddle - React, Tailwind, and code Playground

HTML

<div class="table headee">
    <div class="table-cell">
        <div class="logo">&nbsp;</div>
    </div>
    <div class="table-cell">
        <div class="searchbox">&nbsp;</div>
    </div>
    <div class="table-cell">
        <div class="menu">&nbsp;<br/><br/><br/><br/><br/><br/><br/><br/></div>
    </div>
</div>

CSS

.table {
    display: table;
    width: 100%;
}
.table-cell {
    display: table-cell;
    vertical-align: bottom;
    background: yellow;
}
.logo {
    float: left;
    width: 100px;
    background: green;
}
.menu {
    float: right;
    width: 100px;
    background: red;
}
.searchbox {
    margin: 0 auto;
    width: 100px;
    background: blue;
}