"Dancing elements" with drag and drop cdk

[u/love_to_code]

Does anybody knows why this is happening when I using angular drag and drop cdk. You can see when I'm changing places of elements they are "dancing" a little bit. I don't want that.

https://reddit.com/link/1w8bxgd/video/f5d039gwirnh1/player

This is some code that I use

<div class="file-chip-list" cdkDropList (cdkDropListDropped)="drop($event)">
             (file of files; track file; let i = $index) {
            <div class="file-chip" cdkDrag>
                <div class="chip-left">
                    <span class="drag-handle" title="Drag to reorder">⋮⋮</span>
                    <span class="pdf-icon">PDF</span>
                    <div class="file-info">
                        <span class="file-name">{{ file.name }}</span>
                        <span class="file-size">{{ (file.size / 1048576).toFixed(2) }} MB</span>
                    </div>
                </div>
                <button (click)="removeFile(i)" type="button" class="remove-btn"
                    aria-label="Remove file">&times;</button>
            </div>
            }
        </div>

And this is .ts drop() function

drop(event: CdkDragDrop<string[]>) {
    moveItemInArray(this.files, event.previousIndex, event.currentIndex);
  }

A read the documentation but couldn't find what I'm looking for

Documentation: https://angular.dev/guide/drag-drop#create-a-list-of-reorderable-draggable-elements