title: jQuery UI Draggable with Bootstrap layout
body: <p>jQuery draggable elements goes under the bootstrap styled columns (col-*). For example, I have two <code>.row</code> each divided into 4 columns (with <code>col-md-3</code>). I am trying to get the first row columns to be draggable onto 2nd row droppable columns. </p>
  
  <p>But when I drag 'Drag #' elements, they always go under the 'droppable' elements. I am not able to get drop working with Bootstrap styles. </p>
  
  <p>Can someone explain why this is happening and provide a solution? </p>
  
  <p>Bootply Exmple: <a href="http://www.bootply.com/THBX5GJnCn" rel="nofollow">http://www.bootply.com/THBX5GJnCn</a></p>