title: Dynamic grid on drag and drop Bootstrap
body: <p>my question how would I create a dynamic grid when dragging/droping items over the droppable area.</p>
  
  <p>I would like to use jquery UI, because I would need it just for this feature, and that is a lot of code for only one thing.</p>
  
  <p>I would like to do something like this <a href="http://mcpants.github.io/jquery.shapeshift/" rel="nofollow noreferrer">http://mcpants.github.io/jquery.shapeshift/</a> but much less complicated.</p>
  
  <p>I will attach a screen shot of my grid. The elements that are draggable are "ddd".</p>
  
  <p>It is an angularjs APP, and I am using this library for drag and drop: <a href="https://github.com/fatlinesofcode/ngDraggable" rel="nofollow noreferrer">https://github.com/fatlinesofcode/ngDraggable</a></p>
  
  <p>Tried to use this library, but I could get it to work:
  <a href="https://github.com/RubaXa/Sortable" rel="nofollow noreferrer">https://github.com/RubaXa/Sortable</a></p>
  
  <p>Any suggestions?<img src="https://i.stack.imgur.com/NlKQK.png" alt="enter image description here"></p>