JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/ui-lightness/jquery-ui.css">
<div id="resizable1" class="ui-widget-content">     <h3 class="ui-widget-header">Helper</h3>
</div> 

 <img id='resizable' src="http://www.vworker.com/RentACoder/DotNet/assets/logo-freelancer.png"/>

CSS

#resizable { 
    width: 150px; 
    height: 150px; 
    padding: 1.2em; 
        margin: 1.2em; 
    top: 20px;
    left: 30px;
}
#resizable h3 { 
    text-align: center; 
    margin: 0; 
}     
.ui-resizable-helper { 
    border: 2px dotted #00F; 
}
.ui-resizable-handle {
    width: 15px;
    height: 15px;
    border: 1px solid black;
    z-index:40000;
    position:absolute;
}    
.ui-resizable-s, .ui-resizable-n {
    left: 50%;
}
.ui-resizable-w, .ui-resizable-e {
    top: 50%;
}
.ui-resizable-se {
    background-image: none;
    right: -5px;
    bottom: -5px;
}

JavaScript

$(function() {
    $("#resizable").resizable({
        handles: 'n, s, e, w, ne, se, sw, nw'
    });
     $("#resizable1").resizable({
        handles: 'n, s, e, w, ne, se, sw, nw'
    });
});