title: Angular CDK Drag Drop Absolutely Position Elements Without Jumping
body: <p>I'm trying to use the Angular Drag/Drop from the CDK to implement a basic sidebar with draggable elements where the user can drop them anywhere in the "content" area. Meaning, the elements should ultimately be absolutely positioned and should be able to live wherever the user wants them, including on top of each other.</p>
  
  <p>I'm trying to use cdkDropListConnectedTo with a cdkDropList. I have it mostly working <a href="https://stackblitz.com/edit/angular-13hhqr?file=src%2Fapp%2Fapp.component.ts" rel="nofollow noreferrer">here</a>, but you can see that when dragging multiple items onto the content area, the previous items jump around. I want the user to be able to drag and drop as many items on the content area as they want, and they should be able to be dropped wherever they please without affecting the other elements. </p>
  
  <p>It seems like some simple CSS would be able to fix this, but now I'm wondering if this is not the right way to go about making this happen.</p>
  
  <p><a href="https://i.stack.imgur.com/gaFf5.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/gaFf5.gif" alt="angular cdk drag drop"></a></p>
  
  <p><strong>Updated gif after adding cdkDropListSortingDisabled="true"</strong></p>
  
  <p><a href="https://i.stack.imgur.com/SGUmo.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/SGUmo.gif" alt="angular cdk drag drop"></a></p>