JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <div id="menu">Menue</div>
    <div id="content">Content,filled dynamically by CMS.<br/><br/>I need a solution to force #sidebox_bottom_fluid (green) to go along with the height of #content</div>
    <div id="sidebox_top">fixed height</div>
    <div id="sidebox_bottom_fluid">fluid height</div>
</div>

CSS

#wrapper { 
	float: left;
	width: 250px; 
	height: auto; 
}

#menu {
    background: yellow;
	float: left;
	width: 250px; 
	height: auto; 
}

#content { 
	float: left;
	width:200px;
	min-height:160px;
	height:auto;
	background: grey;
}

#sidebox_top {
    background: red;
	float: left;
    width:50px;
	min-height:40px;
}

#sidebox_bottom_fluid {
    background: green;
	float: left;
	width:50px;
	min-height:40px;
	height:100%; /* Like with the old table layouts, but it won´t work */
}