JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
<div id="main">Main content goes here. This part I want to be fluid width, while the sidebar should be fixed. Try resizing the window/frame.</div>
<aside>Sidebar content goes here</aside>
</div>
CSS
#container {
max-width: 600px; /* bigger in production */
margin: 0 auto;
background: #BAE9E9;
}
#main, aside {
display: table-cell;
padding: 10px;
}
aside {
width: 100px;
background: #8AB9B9;
}