JSFiddle - React, Tailwind, and code Playground

by TJ VanToll

HTML

<link href="http://code.jquery.com/ui/jquery-ui-git.css" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-git.js"></script>
<script src="http://code.jquery.com/ui/jquery-ui-git.js"></script>

<div class="resizable">
    <div class="first">
        <p>Resize me, then scroll me, then resize me again.</p>
    </div>
</div>
<div class="second">World</div>

CSS

.resizable {
    background: yellow;
    height: 200px;
    overflow: hidden;
}
.first {
    height: 100%;
    overflow-y: auto;
}
p {
    height: 500px;
}
.second {
    background: green;
    height: 200px;
}

JavaScript

$( ".resizable" ).resizable({
    handles: "s"
});