垂直滚动条未显示 [英] Vertical Scroll bar isn't showing

问题描述

我有这个网站:http://fosterinnovationculture.com/infographic/index.html我在显示垂直滚动条时遇到了问题.父 div 的样式为 overflow: hidden;.我在子 div 上设置了一个 overflow-y: scroll; 以便它滚动但不显示滚动条.有谁知道为什么它不显示?

I have this website: http://fosterinnovationculture.com/infographic/index.html and I'm having a problem displaying the vertical scroll bar. The parent div has a style of overflow: hidden;. I set an overflow-y: scroll; on the child div so it scrolls but it's not displaying a scroll bar. Does anyone know why it's not displaying?

这是 .scroll 类的代码:

Here is the code for the .scroll class:

.scroll {
  height: 90vh;
  width: 100%;
  overflow-y: scroll;
  margin: 0 auto;
  -webkit-overflow-scrolling: touch;
}

这是父div的代码:

#users {
 overflow: hidden;
}

推荐答案

在给出答案之前，我会说我在编写 CSS 代码时告诉自己的最重要的事情是:如果我开始不得不 hack 那么我也在努力复杂.

Before giving an answer, I will say that the most important thing I tell myself when coding CSS is: if I start having to hack then I am making it too complicated.

话虽如此，首先删除代码中 overflow: hidden; 的每个实例.

With that said, start by removing every instance of overflow: hidden; in your code.

然后把它放在那里:

.top-nav {
    height: 70px; /* you already specify this on your site */
}
.scroll {
    position: absolute;
    top: 70px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    overflow-y: scroll;
}

这篇关于垂直滚动条未显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！