JSFiddle - React, Tailwind, and code Playground
HTML
<div class="drag">
<p>Exemple bloc</p>
</div>
<div class="drag">
<p>Exemple bloc</p>
</div>
<div id="drop">
<p>Drop here</p>
</div>
CSS
.drag {
height: 150px;
width: 150px;
background: #505050;
color: #FFFFFF;
padding: 10px;
display: inline-block;
margin: 0 10px 10px 10px;
}
#drop {
width: 100%;
height: 600px;
background: #FFFFFF;
border: 1px solid #999999;
}
JavaScript
$(".drag").draggable({
opacity: 0.7,
snap: '#drop',
cursor: "move",
revert: "invalid",
//helper: "clone"
});
$("#drop").droppable({
drop: function(event, ui) {
}
});