IE10 阻止滚动条出现在内容上并消失答案

【问题标题】：IE10 stop scroll bar from appearing over content and disappearingIE10 阻止滚动条出现在内容上并消失
【发布时间】：2013-05-25 18:25:38
【问题描述】：

如果您访问的任何网站的内容会导致 ie10（桌面）中出现垂直滚动条，例如 http://www.buildwindows.com/，您会注意到滚动条仅在您将鼠标悬停在窗口上时才会出现。

是否有强制滚动条始终显示？我担心这会让页面下方有更多内容变得不那么明显。

谢谢

【问题讨论】：

我发现只有在添加@-ms-viewport { width: device-width; 时才会消失根据忽略元视口标记的 Windows 8 的“修复”到 CSS（请参阅timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design）
感谢下面的 Pedro 的回答。 Sill 不确定为什么我因为一个完全合理的问题而被否决。
查看stackoverflow.com/questions/17045132/…

【解决方案1】：

有一个自定义的供应商前缀 CSS 属性需要设置：

html {
   -ms-overflow-style: scrollbar;
}

其他选项包括auto、none、scrollbar 和-ms-autohiding-scrollbar。后者会导致您遇到的行为。

摘自MSDN documentation，特别是上面提到的scrollbar值：

指示元素在其内容溢出时显示经典滚动条类型的控件。

与-ms-autohiding-scrollbar 不同，-ms-overflow-style 属性设置为scrollbar 的元素上的滚动条始终显示在屏幕上，并且在元素处于非活动状态时不会淡出。

【讨论】：

谢谢。这正是我所追求的！
还要花费更多时间让网站在 IE 中正确显示。 +1，为我工作。
这很好用，但我很好奇在 windows 手机或平板电脑上会发生什么？在我的计算机上，我想摆脱这种行为，因为滚动条出现在内容上方。您知道是否有办法为平板电脑和手机等纯触摸设备禁用它？
@Redtopia - 通常，在移动设备上，滚动条是不显眼的并且具有自动隐藏的默认行为。如果您发现其他更适合您的 -ms-overflow-style 选项，只需为触摸设备或具有不同值的不同屏幕尺寸创建相同的 .html 规则。
这正是我想要的。

【解决方案2】：

这应该可以解决问题，当屏幕大于 992 像素时，媒体查询将防止滚动消失。（我假设 Windows 移动设备需要它来隐藏滚动条。这就是我进行媒体查询的原因）。

@-ms-viewport {
  width: device-width;  
}
@media (min-width: 992px) {
  @-ms-viewport {
    width: auto !important;
  }
}

【讨论】：

【解决方案3】：

css 样式

overflow-y:scroll;

将使其设置的元素始终具有垂直滚动条

【讨论】：

你可能必须使用overflow:scroll;，IE 可能没有实现overflow-y 样式。另外，您将样式应用于什么？
那么它也不起作用。给我看一个你已经实现它的网站，并在 IE10 中检查。将此样式应用于 1. HTML、2. 正文、3. HTML、正文。
感谢您的回答，但这并不是在没有足够的内容导致滚动条时强制滚动条。这是关于阻止 IE10 隐藏滚动条直到悬停在窗口上。想一想，我认为这发生在 Mac 上，但感觉更好。

【解决方案4】：

我在 html 元素上添加了这个，即 html{-ms-overflow-style: scrollbar;} 它对我有用。

【讨论】：

【解决方案5】：

添加此 META-Tag 有效：

<meta http-equiv="X-UA-Compatible" content="IE=9">

【讨论】：