html 滚动条出现在一台机器上的溢出容器中,而另一台机器上没有

a0x5cqrl  于 2023-04-18  发布在  其他
关注(0)|答案(2)|浏览(134)

几周前,我在另一台机器上创建了一个Web应用程序(Ubuntu上的Chrome)第一次,惊恐地看着出现在我所有溢出容器中的滚动条。我做了一个心理笔记,稍后修复它,但由于我在平时的机器上查看网站时看不到这个问题,我很快就忘了。我只是在我偶尔使用的另一台机器(Mac上的Chrome)上查看它,滚动条混乱又回来了。然而,当我在我现在使用的机器上查看我的Web应用程序时,滚动条的行为符合预期。下面是演示的图像。
第一个是我当前机器的屏幕截图,是一个带有overflow: scroll的聊天框:

相同的聊天框,相同的代码,相同的浏览器,但在我的另一台Mac上:

看看那些丑陋的东西。就像我的浏览器回到了10年前。两台机器都有相同版本的Chrome(58.0.3029.110(64位)),但不同版本的Apple OS(工作的是Sierra 10.12.4,非工作的是El Capitan 10.11.5)。这个滚动条行为在Ubuntu机器上也能看到。2请注意,滚动条在两台机器上都能像预期的那样在Firefox中工作。
编辑
为了演示预期的效果,下面是一张垂直滚动条的图片,它只在工作机器上滚动时才出现:

pw9qyyiw

pw9qyyiw1#

尝试使用overflow:auto;而不是overflow:scroll;。它将解决这个问题,因为它会根据父级中的内容自动显示或隐藏滚动条!

qkf9rpyu

qkf9rpyu2#

我偶然发现这篇文章也有类似的问题,我想我应该提到,如果你在“另一台Mac”上使用鼠标,而不是在原来的机器上,这两者之间的区别可以解释。
但正如所述elsewhereoverflow:auto;将是一个解决方案。

相关问题