JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-2.2.3.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script src="https://cdn.jsdelivr.net/lodash/4.11.0/lodash.min.js"></script>
<script src="https://cdn.css.net/libs/gridstack.js/0.2.5/gridstack.js"></script>
<link rel="stylesheet" href="https://cdn.css.net/libs/gridstack.js/0.2.5/gridstack.css">
<body>
<div class="container-fluid">
		<h1>Resize Test</h1>

		<div class="grid-stack">
			<div class="grid-stack-item" data-gs-x="0" data-gs-y="0" data-gs-width="2" data-gs-height="2">
				<div class="grid-stack-item-content"></div>
			</div>
			<div class="grid-stack-item" data-gs-x="4" data-gs-y="0" data-gs-width="2" data-gs-height="4">
				<div class="grid-stack-item-content"></div>
			</div>
		</div>
	</div>
  </body>

CSS

body {
			font: 12px/20px 'Lucida Grande', Verdana, sans-serif;
			color: #404040;
			background: #f0f0f0;
		}

		/* The Grid Widgets */
        .grid-stack {
			background: #f0f0f0;
        }

		.grid-stack .grid-stack-item .grid-stack-item-content,
		.grid-stack .grid-stack-item .placeholder-content {
		    left: 5px;
		    right: 5px;
		}

        .grid-stack-item-content {
			background: white;
			padding: 0px 0px;
			margin: 0px 0px;
			box-shadow: 0 3px 3px rgba(0, 0, 0, 0.5);
			border-radius: 4px;
			border: 1px solid rgba(0, 0, 0, 0.1);
        }

		.grid-stack-item-content-header {
			padding: 0px 10px;
			border-bottom: 1px solid #ddd;
		}

		.grid-stack-item-content-header > p {
			margin: 3px;
			color: #777;
			font-size: 12px;
		    font-weight: bold;
		}

JavaScript

$(function () {
			var options = {
				cellHeight: 40,
				verticalMargin: 10
			};
			
			$('.grid-stack').gridstack(options);
        });

		$( document ).ready(function() {
			$('.grid-stack-item').on('resizestop', function () {
				alert("width: "+this.attributes.getNamedItem('data-gs-width').value+" height:"+this.attributes.getNamedItem('data-gs-height').value);
			});
		});