ios исправлен прокручиваемый элемент, который проглатывает некоторые из его дочерних узлов и затем становится нормальным

Question

введите описание изображения здесь Привет всем. Я сталкиваюсь с этой проблемой. Похоже, что фиксированный элемент перекрывает некоторую часть его дочерних элементов, и при прокрутке или ожидании в течение нескольких секунд он становится нормальным. И это происходит только на ios 13.3 устройствах.

Вот код less для внешнего фиксированного контейнера, названного как item-list, и первого внутреннего потомка:

.item-list {
  width: unit((702-48)/750 * 100, vw);
  height: unit(841/1624 * 100, vh);
  position: fixed;
  z-index: 21;
  background-color: #fff;
  border-radius: unit(24/750 * 100, vw) unit(24/750 * 100, vw) 0 0;
  left: 50%;
  transform: translateX(-50%);
  transition: linear 0.3s all;
  overflow-y: scroll;
  border: solid #fff unit(24/750 * 100, vw);

  .item-card {
    margin: unit(28/750 * 100, vw) 0;

    &:first-child {
      margin-top: 0;
    }
  }
}

для внутреннего потомка, названного как item-card:

.item-card {
  height: unit(200/750 * 100, vw);
  position: relative;
  display: flex;
  display: -webkit-flex;
  width: 100%;
  cursor: pointer;

  .num {
    position: absolute;
    left: 0;
    top: 0;
    height: unit(32/750 * 100, vw);
    width: unit(62/750 * 100, vw);
    color: #fff;
    font-size: unit(22/750 * 100, vw);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(51, 51, 51, 0.8);
    border-radius: unit(12/750 * 100, vw) 0;
  }

  img {
    height: unit(200/750 * 100, vw);
    width: unit(200/750 * 100, vw);
    border-radius: unit(12/750 * 100, vw);
    object-fit: cover;
    pointer-events: none;
  }

  .info {
    padding-left: unit(24/750 * 100, vw);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    font-size: unit(32/750 * 100, vw);
    flex: 1;

    .title {
      word-break: break-all;
      display: -webkit-box;
      overflow: hidden;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
    }

    .price {
      color: #ff2851;

      span {
        font-size: unit(20/750 * 100, vw);
      }
    }
  }
}

ключевая информация: 1. все фиксированные относительные абсолютные; 2. используется линейный зажим; 3. Переполнение прокрутки; 4. используется z-индекс; 5. используя VW способ адаптировать размер устройства; 6. произошло в нативном webview;