自定义 CSS 滚动条在最右边的像素 0 上没有响应

Question

当光标被拖到最右边，到第 0 个像素时，自定义滚动条没有响应，而是选择了文本，就像在正文中的任意位置拖动一样。

将浏览器设置为全屏或最大化，这样您就知道您没有在窗口调整大小边框上拖动。 （在 Mac 上，稍微滚动一下以显示操作系统滚动条。）

• 不只是我的项目，随便看看CSS-Tricks page。
• 默认操作系统滚动条按预期工作（如 Stackoverflow 上的此处），自定义滚动条不能（如 CSS-Tricks 上）。
• 要在项目中重现，只需声明::-webkit-scrollbar { ... }，例如。给它一个宽度和背景颜色。是的，::-webkit-scrollbar-thumb 是端到端的，我认为这不是问题。
• 发生在 Chrome 和 Electron 上，不了解 Firefox。
• 这很重要，因为它是最后一个像素，即“向右拖动”鼠标操作。这不仅仅是一个像素问题！

有人知道优雅的解决方案吗？干杯

Answer 1

知道了，非常意外的行为。

将主体、主容器或任何主滚动条设置为position: fixed 或absolute，这样您就可以访问right 属性。

设置right: -1px;