JSFiddle - React, Tailwind, and code Playground

HTML

<textarea class="resizable">
Content content content content
Content content content content
Content content content content
Content content content content
</textarea>
<div class="resizable">
    <p>Content content content content</p>
    <p>Content content content content</p>
    <p>Content content content content</p>
    <p>Content content content content</p>
</div>

CSS

.resizable{
    width:300px;
    height: 150px;
}
div.resizable{
    resize:both;
    overflow: auto;
    border: 1px solid #000;
}

JavaScript

function contains(container, maybe) {
    return container.contains ? container.contains(maybe) :
        !!(container.compareDocumentPosition(maybe) & 16);
}
function mouseEnterLeave(elem, type, method) {
    var mouseEnter = type === 'mouseenter',
        ie = mouseEnter ? 'fromElement' : 'toElement';
    return function (e) {
        e = e || window.event;
        var target = e.target || e.srcElement,
            related = e.relatedTarget || e[ie];
        if ((elem === target || contains(elem, target)) &&
            !contains(elem, related)) {
            method.call(elem, e);
        }
    };
}
function resizableStart(e){
    this.originalW = this.clientWidth;
    this.originalH = this.clientHeight;
    this.onmousemove = resizableCheck;
    this.onmouseup = resizableEnd;
    this.onmouseout = mouseEnterLeave(this, 'mouseleave', resizableEnd);
}
function resizableCheck(e){
    if(this.clientWidth !== this.originalW || this.clientHeight !== this.originalH) {
        this.originalX = e.clientX;
        this.originalY = e.clientY;
        this.onmousemove = resizableMove;
    }
}
function resizableMove(e){
    var newW = this.originalW + e.clientX - this.originalX,
        newH = this.originalH + e.clientY - this.originalY;
    if(newW < this.originalW){
        this.style.width = newW + 'px';
    }
    if(newH < this.originalH){
        this.style.height = newH + 'px';
    }
}
function resizableEnd(){
    this.onmousemove = this.onmouseout = this.onmouseup = null;
}
var els = document.getElementsByClassName('resizable');
for(var i=0, len=els.length; i<len; ++i){
    els[i].onmouseover = mouseEnterLeave(els[i], 'mouseenter', resizableStart);
}