如何在 IE 11 中滚动

Question

这是一个 CSS 问题。如果标签溢出，我正在尝试滚动。问题仅出在 Internet Explorer 上，而与 Firefox 和 Chrome 无关。我检查了这个问题： overflow-y scroll not working in IE 11.

这是来自 Firefox 的屏幕截图：

但这不适用于 IE 11：

这是我的 scss：

.pt-tokens>ul.pt-token-list {
    padding: 10px 0px 10px 0px;
    font-size: $font-size-16;
    line-height: 22px;
    max-height: $height-active-filters-tokens-cont;
    min-height: $height-active-filters-tokens-cont;
    max-width: 100%;
    background-color: $color-gray-245;
    outline: none;
    overflow: scroll;
   -ms-overflow-style: -ms-scrollbar;
}

这是 IE 11 的 DOM Explorer：

我尝试了很多解决方案。我也试过：

1. -ms-overflow-style:-ms-autohiding-scrollbar;
2. -ms-overflow-style: 滚动条；

.fruit-wrapper {
  padding: 10px 0px 10px 0px;
  font-size: 16px;
  line-height: 22px;
  max-height: 50px;
  min-height: 50px;
  max-width: 100%;
  background-color: green;
  outline: none;
  overflow: auto;
}

<div class="fruit-wrapper">
  <ul>
    <li>
      Apple
    </li>
    <li>
      Bananna
    </li>
    <li>
      Mango
    </li>
    <li>
      Grape
    </li>
    <li>
      Orange
    </li>
  </ul>
</div>

Answer 1

由于各种浏览器之间的间距差异，这种情况经常发生。有些可能需要滚动条，而有些则可能不需要（这会导致滚动条阻碍某些项目）。

尝试使用overflow: auto; 仅在必要时显示栏。