css - Chrome : mouse hover on some elements causes vertical scrollbar to jump to the top

Question

我有一个页面上包含垂直滚动条的应用程序，因为页面上的两个列表之一可能很长，我希望用户向上或向下滚动。我发现有时用户只是将鼠标悬停在页面上的其他元素上，突然间如果滚动条位于底部，Chrome 会导致滚动条跳到顶部。

有人在 Chrome 中看到过这种行为吗？它适用于其他浏览器。我尝试更改其中一个标题 div 元素的底部填充:

padding: 0.75em 2em 1.75em 2em;

而且好像减少了问题，但是还是偶尔会出现这个问题。我确实注意到的一件事是，当我的一个列表太长时，它就会发生。

Answer 1

原来是CSS的问题。每当元素悬停时，CSS 都会使用 :hover 选择器在元素上添加一个框阴影。这导致边框增加并导致列表大小发生变化。当我删除 box-shadow 时，问题就消失了。这不是 Chrome 的问题。