JSFiddle - React, Tailwind, and code Playground

HTML

<div id="headernav">
                <div id="logo"></div>
                <nav id="navbar"></nav>
 </div>

CSS

#headernav{
    border:10px green solid;
    height: 60px;
}
#logo{
    float:left;
    height:100%;
    width: calc(100% - 50px);
    background:red;
}
#navbar{
    float:left;
    width:50px;
    height:100%;
    background: blue;
}