JSFiddle - React, Tailwind, and code Playground

HTML

<div class="header">
    <div class="logo">
        <span></span>
    </div>
    <div class="link">
        <span></span>
        <span></span>
        <span></span>
    </div>
</div>

CSS

.header{
    overflow:hidden;
    min-width:500px;
}
.logo{
    float:left;
    width:400px;
    text-align:center;
}
.logo>span{
    display:inline-block;
    width:360px;
    height:50px;
    margin:10px 0px;
    background:#bbb;
}
.link{
    float:right;
    width:160px;
    text-align:center;
}
.link>span{
    display:block;
    width:150px;
    height:20px;
    margin:1px 0px;
    background:#bbb;
}

@media screen and (max-width:600px){
    .logo,.link{
        float:none;
        width:auto;
        min-width:;
    }
    .link>span{
        display:inline-block;
    }
}