可滚动的 div，在出现的滚动条上跳转内容（！not！html 或 body）（仅适用于 css）答案

【问题标题】：scrollable div, jumping content on appearing scrollbar (!not! html or body) (and only with css)可滚动的 div，在出现的滚动条上跳转内容（！not！html 或 body）（仅适用于 css）
【发布时间】：2018-05-18 09:59:04
【问题描述】：

我在可滚动 div 中跳转内容时遇到问题（溢出-y：自动）。问题不是如何解决所有“解决方案”都指向的页面 html 或 body 元素。我需要一个带有动态内容的可滚动 div。滚动条也不应该总是可见的（所以 overflow-y: 滚动是不可接受的）。而且这必须是仅使用 css 的修复。我对此有一个小提琴：

[http://jsfiddle.net/4n1au2Ly/][1]

您可以在此处垂直缩小输出面板以查看出现的滚动条和移动的内容。那么，如何解决呢？非常感谢:)

【问题讨论】：

对于损坏的链接外观感到抱歉。我找不到编辑按钮。所以再次在这里，链接：http://jsfiddle.net/4n1au2Ly/

标签： html css scrollbar

【解决方案1】：

我完全不懂问题，但是overflow-y: auto;可以解决你的问题吗？

【讨论】：

不，我使用overflow-y: auto;。 this 是问题所在，因为这导致了上述问题；）
对不起，我在容器类中看不到它，我已将其指向字母类
但它是容器类；）：.container{ overflow-y:auto; overflow-x:hidden; height:100vh; width:500px; }

【解决方案2】：

CSS 唯一的解决方案根本不存在这个问题。您必须依靠 JavaScript 来实现这一点。使用 JavaScript 执行此操作：

监听页面加载 (DOMContentLoaded) 和 resize 事件。
以绝对像素为单位设置div 的宽度。
每当触发上述事件时，重新计算 div 的宽度并将其设置为父宽度，并减去合理的滚动条默认值，例如 20 像素。

【讨论】：