JSFiddle - React, Tailwind, and code Playground

by isochronous

HTML

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>

<div class="container">
    <div id="sidebar">
    
    </div>
</div>

CSS

html {
    height: 100%;
    width: 100%;
}

#container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

#sidebar {
    position: fixed;
    top: 0;
    right: 0;
    width: 200px;
    height: 100%;
    background-color: blue;
}

JavaScript

$('#sidebar').resizable({
	handles: 'w'
});