JSFiddle - React, Tailwind, and code Playground
HTML
<section>
<article>I fill out all the available space!</article>
<aside>I'm 50px width!</aside>
</section>
CSS
body {
display: table;
table-layout: fixed;
width: 100%;
border-spacing: 0;
border-collapse: separate;
margin: 0;
}
section {
display: table-row;
padding: 25px;
background: #eee;
overflow: hidden;
}
article, aside {
display: table-cell;
padding: 5px;
}
article {
background: #cee;
}
aside {
width: 50px;
background: #ece;
}
* {
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}