title: Angular CDK drag and drop issue inside CSS flexbox
body: <p>I ran into an issue using drag and drop module from the Angular CDK. I use it inside a container div which has (among others) the following CSS properties :</p>
  
  <pre><code>display: flex;
  flex-wrap: wrap;
  </code></pre>
  
  <p>The <code>flex_wrap</code> property is here so that if the contained draggable elements don't fit in the container, they wrap into a second line and so on. </p>
  
  <p>As the dragging is horizontal (<code>cdkDropListOrientation="horizontal"</code>), this works fine when all elements fit in a single line, but as soon as they wrap to a second line, drag and drop becomes buggy. I made the following stackblitz to reproduce the error : <a href="https://stackblitz.com/edit/angular-fytgp6" rel="noreferrer">https://stackblitz.com/edit/angular-fytgp6</a> .</p>
  
  <p>If anyone know how to fix this issue or thinks about a workaround for this, it would be of great help ! </p>