угловое перетаскивание: после изменения элемента перетаскивания элемент все элементы будут ниже каждого

Question

[сначала до деформации Привет, у меня вопрос о перетаскивании в agnular.После падения div с childs все его childs изменят ширину, а также обернутся ниже друг друга.Я не могу решить эту проблему.Кто-нибудь поможет мне?

<mat-accordion>
            <mat-expansion-panel cdkDropList [cdkDropListData]="project.emps" (cdkDropListDropped)="drop($event, project.id)" expanded>
                <mat-expansion-panel-header></mat-expansion-panel-header>
                <div>
                    <mat-card-content
                        fxLayout="row"
                        fxLayoutAlign="space-between center"
                        *ngFor="let item of project.emps"
                        cdkDrag
                        (cdkDragStarted)="drag($event, project.id, item)"
                    >
                        <div class="role {{ item.role }}">
                            {{ item.role }}
                        </div>
                        <div>
                            <span>{{ item.name }}</span>
                        </div>
                        <div>{{ item.availability }} %</div>
                    </mat-card-content>
                </div>
            </mat-expansion-panel>
        </mat-accordion>