JSFiddle - React, Tailwind, and code Playground
by Sub Lines
HTML
<div class=page>
<div id=main>Foo</div>
<div id=side>Bar</div>
</div>
CSS
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.page {
display: -webkit-flex;
display: -moz-flex;
display: flex;
}
.page > div {
padding: 20px;
-webkit-flex: 1;
-moz-flex: 1;
flex: 1;
}
#main {
background: #bbb;
}
#side {
background: #ddd;
-webkit-flex: 0 0 200px;
-moz-flex: 0 0 200px;
flex: 0 0 200px;
}