在 Internet Explorer 中为忽略的类显示滚动条答案

【问题标题】：Show scroll bar in Internet Explorer for ignored class在 Internet Explorer 中为忽略的类显示滚动条
【发布时间】：2016-07-06 22:55:49
【问题描述】：

在 Internet Explorer 和 Edge 中，我试图隐藏溢出元素上的所有滚动条，具有特定类的元素除外：

*:not(.ignore-scrollbar-rule) {
    -ms-overflow-style: none;
}

但是，我无法应用此规则，并且滚动条即使在具有 ignore-scrollbar-rule 类的元素上也是隐藏的。在 IE/Edge 中忽略此规则是否有原因？

【问题讨论】：

确定这里没有其他冲突规则吗？如果它隐藏了 all 滚动条，则只有两个选项：类是错误的并且在 CSS 和 HTML 中不一样，或者有另一个规则将滚动条隐藏在不应该出现的地方。代码检查员说什么？
@BramVanroy，我包含了一个 JS Fiddle，其中包含了最基本的问题。我将不得不继续寻找。但在那个例子中，没有别的了。

【解决方案1】：

嗯，问题似乎是该规则也适用于内部元素（因为它应该适用于您将其分配给所有元素）并且由于某种原因该属性然后冒泡，或者至少被 Edge 错误解释。对我来说似乎是一个错误。您可以通过仅选择外部类like so 来绕过它。

.outer:not(.ignore-scrollbar-rule) {
    -ms-overflow-style: none;
}

【讨论】：

啊，有道理。那么关于这个的快速问题。所以这个类有可能被用于任何元素，并且为每个可能的元素编写 CSS 是不可能的，这就是为什么它以 * 为前缀。我假设我可能不走运做这样的事情？
@KevBot 我以为你会的。我一直在尝试一些东西，但找不到解决方案。我建议您等待，也许其他人可以提出解决方案。这是一个有趣的问题。几天后，您可能希望在这个问题上开始悬赏 50 人以引起注意。

【解决方案2】：

要在 Internet Explorer 中执行此操作，您不能使用 :not(...)。您需要有两个单独的选择器。一个针对所有内容，另一个针对一个（类名）。

* {
    -ms-overflow-style: none;
}

.ignore-scrollbar-rule {
    -ms-overflow-style: auto;
}

现在.ignore-scrollbar-rule 规则可以应用于您想要的任何元素，而不受其层次结构的影响。

【讨论】：