JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://yui.yahooapis.com/3.15.0/build/yui/yui.js"></script>
<div id="main-content">
    <ol>
        <li>Drag the yellow rectangle</li>
        <li>Drag the blue rectangle</li>
        <li>Click on the link</li>
        <li>Drag the yellow rectangle</li>
    </ol>
    <div class="portlet-boundary">
        <div class="portlet-content">
            <div class="portlet-boundary">
                <a href="javascript:;">Click me!</a>
            </div>
        </div>
    </div>
</div>

CSS

.portlet-boundary {
    background-color: #2727D6;
    height: 300px;
    margin: 40px;
    width: 400px;
}

.portlet-boundary .portlet-boundary {
    background-color: #D6AD27;
    height: 50px;
    padding: 20px;
    position: relative;
    left: 50px;
    top: 50px;
    width: 200px;
}

a {
    
}

JavaScript

YUI({filter: 'raw'}).use('dd-delegate', function (Y) {
   new Y.DD.Delegate({
       container: "#main-content",
       handles: [".portlet-boundary"],
       nodes: ".portlet-boundary"
   });
});