即使没有要滚动的内容，也会出现 CSS 溢出滚动条

Question

我正在使用溢出：滚动，就像下面的代码一样，我遇到的问题是即使没有文本，滚动条仍然显示。
W3学校的演示：http://www.w3schools.com/cssref/tryit.asp?filename=trycss_overflow您会看到，即使您无法水平滚动（向左或向右），仍然有一个滚动条。如果没有什么可滚动到的，我正在尝试将其放在滚动条不出现的地方。希望这是有道理的

<style type="text/css">
  div.scroll {
    background-color: #00FFFF;
    width: 100px;
    height: 100px;
    overflow: scroll;
  }
</style>
<p>overflow:scroll</p>
<div class="scroll">You can use the overflow property when you want to have better control of the layout. The default value is visible.</div>

Answer 1

我认为您正在寻找overflow: auto.

Mozilla 关于溢出的文档

overflow CSS 属性是 overflow-x 和 overflow-y 属性的简写，它指定当内容太大而无法容纳其块格式上下文时要执行的操作。

这些选项包括剪辑、显示滚动条或显示从其容器流出到周围区域的内容。

自动

取决于用户代理。如果内容适合填充框，则它看起来与可见相同，但仍会建立新的块格式上下文。像 Firefox 这样的桌面浏览器会在内容溢出时提供滚动条。

Answer 2

尝试

overflow: auto

您提供的链接非常复杂。这是所有解释，我认为更好：CSS技巧

Answer 3

尝试overflow: auto;所以滚动根据是否需要自动发生。

使用overflow-x: auto或overflow-y: auto如果您只想获得一个方向的自动滚动条