JSFiddle - React, Tailwind, and code Playground

by James

HTML

<div id="container">
    <div id="fixed-width"></div>
    
    <div id="flexible-width"></div>
</div>

CSS

#container {
    float: left;
    width: 100%;
    padding: 50px;
    background: lightgrey;
    position: relative;
    overflow:hidden;
}

#fixed-width {
    float: left;
    width: 200px;
    height: 500px;
    margin-right: 60px;
    background: blue;
}

#flexible-width {
    float: left;
    left: 200px;
    position: absolute;
    width: 100%; /* my goal is that the width always fills up independent of browser width */
    height: 500px;
    background: red;
}