JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://layout.jquery-dev.net/lib/js/jquery.layout-latest.min.js"></script>
<link rel="stylesheet" href="http://layout.jquery-dev.net/lib/css/layout-default-latest.css">
<div id="content">
    <div id="content-left" class="ui-layout-center">foo</div>
    <div id="content-right" class="ui-layout-east">bar</div>
</div>

CSS

#content {
    height: 200px;
}

#content-left, #content-right {
    background: #88bb00;
}

JavaScript

function InitializeLayout(sElement) {
    var oOptions = {
	    closable:               false,
	    resizable:              true,
    	slidable:               false,
    	east__livePaneResizing: true,
	    east__maxSize:          200,
    	east__minSize:          100,
    	east__onresize_end:     function() {
            // GetOverlaySizes();
            // SetOverlaySizes();
            // SetPaperSizes();
    	},
        east__size:             100
    };
    oLayout = $(sElement).layout(oOptions);
    //oLayout.disableResizable('east');
    // oLayout.options.east.resizable = false;
    // console.log(oLayout.state);
}


jQuery(document).ready(function() {
    InitializeLayout("#content");
});