CSS浮动在一个div中但不在另一个div中

Question

我正在处理卡片的拖放操作，将卡片从垂直的行拖到水平div放置区中。但是，卡在放置区中未垂直对齐。

我试图在卡片上向左浮动，并且可以工作并对齐，但是当从垂直卡片行向后拖动第二张卡片时，垂直行中的卡片不跟随鼠标光标移动（拖动卡）。

我如何让我的卡在垂直行中不向左浮动，而在水平div拖放区中仅向左浮动？

垂直排牌：

<div>
    <div *ngFor="let card of availablecards" class="avail-box" appDroppable (dragStart)="currentBox = card">
        <app-card [cardData]="card"></app-card>
        <div class="box box-helper" *appDraggableHelper>
            <app-card [cardData]="card"></app-card>
        </div>
    </div>
</div>

水平落差区：

<div class="dropzone" appDropzone (drop)="move(currentBox, dropzone)" (remove)="move(currentBox, availableCards)">
    <div *ngFor="let card of dropzone" class="box" appDroppable (dragStart)="currentBox = card">
        <app-card [cardData]="card"></app-card>
        <div class="box" *appDraggableHelper>
            <app-card [cardData]="card"></app-card>
        </div>
    </div>
</div>