滚动条在 Chrome 中不显示溢出-y:滚动

J.C*_*art 4 html css google-chrome scrollbar

我使用的是 Chrome 版本 84.0.4147.89,并且有一个 div 使用

overflow-y:scroll;
Run Code Online (Sandbox Code Playgroud)

滚动功能有效,但不显示滚动条。它确实在 IE 中显示。我需要让它显示,因为没有鼠标或触摸屏的用户发现在不可见栏的情况下很难滚动。

我努力了

overflow-y:scroll!important;
Run Code Online (Sandbox Code Playgroud)

但这也不起作用。

我还尝试禁用“可用时使用硬件加速”,因为我在另一个线程中看到了建议,但这也不起作用。

如何让 Chrome 出现滚动条?

谢谢。

Ian*_*kus 6

我认为你必须声明身高。这是我正在使用的示例。

div {
    width: 30vw;
    height: 49.75vw;
    min-height: 1em;
    overflow-y: visible;
    overflow-x: hidden;
    direction: ltr;
    /*position of scroll bar can use rtl if wanted, but use div * {direction: ltr;} if you do.} */
    scrollbar-width: thin;/*fancy width*/
    scrollbar-color: #f3f0dd #154734;/*fancy colors for Firefox*/
}

div::-webkit-scrollbar {
  width: 11px;
}

div::-webkit-scrollbar-track {
  background: #154734;
}

div::-webkit-scrollbar-thumb {
  background-color: #f3f0dd;
  border-radius: 6px;
  border: 3px solid #154734;
}
Run Code Online (Sandbox Code Playgroud)