IonSelect 在 Chrome 和 Safari 上的显示不同

Question

我目前正在创建一个 Ionic 应用程序。 我一直主要在 chrome 上开发。 我最近查看了 safari 上的应用程序，并注意到我的所有 IonSelect 组件图标的下拉菜单都低于它们需要与 chrome 进行比较的位置。 我想知道我可以应用什么样式来在 Safari 上解决这个问题？

这是chrome中的选择：

这是 safari 中的选择：

注意它偏离中心。

此外，在 Chrome 版本上，当您单击下拉菜单时，三角形图标会动画并翻转以指向下方。 Safari 版本根本没有动画。

这是我用于此组件的代码：

<IonItem
      fill="outline"
      className={classString}
      disabled={disabled || options.length === 1}
    >
      <IonLabel position="floating" color="medium">
        {label}
      </IonLabel>
      <IonSelect
        key={selected}
        interface="popover"
        value={selected}
        onIonChange={(e) => {
          if (e.detail.value !== selected) {
            onChange(e.detail.value);
          }
        }}
      >
        {options.map((option) => (
          <IonSelectOption key={option} value={option}>
            {option}
          </IonSelectOption>
        ))}
      </IonSelect>
    </IonItem>


  [1]: https://i.stack.imgur.com/uaU4v.png
  [2]: https://i.stack.imgur.com/vhsBL.png