JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
<div id="right">nav</div>
<div id="left">content</div>
</div>

CSS

*
{
    box-sizing: border-box;
}
#container
{
    border: solid 2px green;
}
#left
{
    border: solid 2px red;
    min-height: 50px;
}

#right
{
    border: solid 2px blue;
    min-height: 50px;
}

@media (min-width: 600px)
{
    #left
    {
        margin-right: 200px;
    }
    #right
    {
        float: right;
        width: 200px;
    }
}
@media (max-width: 599px)
{
    #container
    {
        position: relative;
    }
    #left
    {
        margin-bottom: 50px;
    }
    #right
    {
        position: absolute;
        width: 100%;
        bottom: 0;
    }
}