向右浮动时无法点击按钮

Question

我创建了一个使用添加和删除按钮动态添加输入的表单。我会把它们放在右边

我无法点击删除按钮来执行最新的

HTML 文件：

val mockito by extra { "2.12.0" }
val mockito.version by extra { "2.12.0" }
val `mockito.version` by extra { "2.12.0" }

CSS 文件：

    <mat-step [stepControl]="secondFormGroup">
    <form [formGroup]="secondFormGroup">
        <ng-template matStepLabel>Constituez votre équipe</ng-template>
        <div formArrayName="pers" *ngFor="let control of secondFormGroup.controls.pers.controls; let i= index">
            <mat-form-field>
                <input matInput placeholder="Nom collaborateur #{{i+1}}" [formControl]="control.controls.name" required>
            </mat-form-field>
            <mat-form-field>
                <input matInput placeholder="Poste" [formControl]="control.controls.poste" required>
            </mat-form-field>
            <button *ngIf="secondFormGroup.controls.pers.controls.length > 1" (click)="deleteItem()" mat-mini-fab color="warn" class="rightButton"><mat-icon >remove</mat-icon>
                </button>
        </div>
        <div>{{secondFormGroup.value | json}}</div>


        <button (click)="addItem()" mat-mini-fab color="primary" class="rightButton"><mat-icon >add</mat-icon>
              </button>
    </form>
</mat-step>

当我在删除按钮上禁用.rightButton { position: relative; float: right; } 课程时，我可以单击所有按钮而不会出现问题，但它们的位置并不正确。

Answer 1

试试这个

"symfony/framework-bundle": "v2.2.0" (or a greater version)

Answer 2

对我来说，z-index无效。

该按钮前面有一些不可见的东西。将按钮单独放置会有所帮助。

在Bootstrap 4中，这是我如何使其成为单独的行：

<div class="row block-section">
   <a data-placement="top" class="btn btn-sm btn-danger"
     href="#" onclick="deleteClicked('video1');return false;">Delete </a>
</div>
               

然后它甚至可以在移动设备上使用

浮动：对