html - 滚动条在 IE11 中消失了。是否有任何 CSS 规则可以避免这种情况？

Question

我知道其他帖子问的和我一样，但没有一个选项适合我的情况。

我有一个网络应用程序，可以在不同的浏览器上正常工作，包括 IE (8)。

• 操作系统:Windows 7

当客户更改为 IE11 时，滚动条、SELECT 和 TEXTAREA 元素(可能还有其他元素)消失了。正如您在图像上看到的那样，滚动条似乎在那里但透明。

我已经尝试了谷歌搜索发现的所有兼容性问题。 我尝试过使用样式表(填充了 -ms-viewport{width:auto!important}) 在 Internet 选项>常规>辅助功能...

我们在正文中添加了以下样式规则:

body {
    color: #383838;
    background-position: 0px;
    scrollbar-face-color: #910046;
    scrollbar-shadow-color: #FFFFFF;
    scrollbar-highlight-color: #FFFFFF;
    scrollbar-3dlight-color: #FFFFFF;
    scrollbar-darkshadow-color: #FFFFFF;
    scrollbar-track-color: #FFFFFF;
    scrollbar-arrow-color: #FFFFFF;
} 

Answer 1

我启动了我的 IE11 机器，显示的是:你的箭头是白色的。它们占用空间。使文本区域更高显示它们之间的滚动条。这是预期的行为。

这将使箭头可见:

body {
    color: #383838;
    background-position: 0px;
    scrollbar-face-color: #910046;
    scrollbar-shadow-color: #FFFFFF;
    scrollbar-highlight-color: #FFFFFF;
    scrollbar-3dlight-color: #FFFFFF;
    scrollbar-darkshadow-color: #FFFFFF;
    scrollbar-track-color: #FFFFFF;
    scrollbar-arrow-color: #910046;
} 

这是证明(具有更高的文本区域):http://codepen.io/anon/pen/MyqVag?editors=1100

这是 IE11:

这是 IE8:

IE11 似乎没有箭头后面的“(表面)面”，而 IE8 有。因此 scrollbar-face-color: #910046; 无法在 IE11 中创建箭头对比。 Microsoft 的这篇文章对此提供了支持:https://msdn.microsoft.com/en-us/library/ms531157(v=vs.85).aspx