JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/>
</head>
<body>
<div id="container">
    <div class="demo">
        This is a draggable, and resizable element
    </div>
    <div class="demo">
        This is another draggable, and resizable element
    </div>
</div>
</body>
</html>

CSS

body, input{
    font-family: Calibri, Arial;
    margin:0px;
}

.demo {
    width:100px;
    height:100px;
    padding:5px;
    background-color:#ff8811;
    /*top:10px;
    left:10px;*/
    margin-bottom: 10px;
}
#content { padding-bottom: 3em; }
.block-bar {
    background: rgba(0, 0, 0, 0.5);
    text-align: right;
    padding: 3px;
    font-size: 12pt;
}
.block-bar a {
    color: #fff;
}
#container {
    position: relative;
    border: 1px solid #000;
    /*position: relative;*/
    padding: 10px;
    margin: 20px auto;
    width: 400px;
}

JavaScript

$(function(){
    $("#container").resizable();

    $('.demo').draggable().resizable();

});