フロートを右に移動するとボタンをクリックできません

Question

追加と削除のボタンで入力を動的に追加するフォームを作成しました。私はlastet 1

HTMLファイルexept削除ボタンをクリックすることはできません右

の上に置きます：

<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> 

CSSファイル：

.rightButton { 
    position: relative; 
    float: right; 
} 

削除ボタンでrightButtonクラスを無効にすると、問題なくすべてのボタンをクリックできましたが、必要な位置に正しく配置されていません。 absolute`または `fixed`：

Answer 1

あなたは`位置としてそれを持つべきである。この

.rightButton { 
    position: relative; 
    z-index: 99; 
    float: right; 
}