我有一个 angular 应用程序，其标题分为 3 个部分。如果用户已经登录，则右上角部分可以包含登录按钮或用户个人资料图标。

在 Chrome 中，div 内容居中。

但在 Firefox 中，right_side_section div 上升。

html 文件是

  <div class="right_side_section">
    <div class="header_btn" *ngIf="!isUserLogin">
      <button type="submit" class="btn btn_right" (click)="openLoginmodal()">Connexion</button>
    </div>

   <div *ngIf="isUserLogin" class="header_Profile">
          <div class="profile_img">
            <img *ngIf="appUser; else profile" src="{{ appUser.userPhotoUrl }}" />
            <ng-template #profile>
              <img  src="assets/media/image/profile/profile.png"/>
            </ng-template>
          </div>
          <div class="profile_padding">
          <div class="profile_details">
            <div class="profile_list">
              <div class="profile_details_img profile_adaptation">
                <img *ngIf="appUser; else profile" src="{{ appUser.userPhotoUrl }}" />
                <ng-template #profile>
                  <img  src="assets/media/image/profile/profile.png"/>
                </ng-template>

              </div>

            </div>
          </div>
        </div>
    </div>

  </div>

和CSS

.right_side_section{
  position: absolute;
  right: 34px;
  bottom: 0;
  top: 0px;
  display: flex;
  align-items: center;
}

我注意到 div.right_side_section 在 chrome 上是 50 * 90，在 Firefox 上是 50 * 65。 拜托，我怎么能纠正它？

提前致谢。