html - 滚动条没有完全向下滚动页面

Question

我有这个小问题。我有一个类为 scroll 的主 div。我还有其他几个输入参数，我从用户那里获取输入。此输入垂直填满整个页面。

现在我使用 Chrome 最小化按钮最小化屏幕。 (即恢复向下按钮)。由于设置为 overflow:scroll，页面会缩小并显示滚动条。

现在的问题是它不会滚动到页面末尾。假设有 20 个输入参数，当我最小化时，我只能滚动到第 18 个输入参数。滚动条不会超过 18 位并隐藏最后 2 位，因此查看者无法看到。

<div class="scroll">
</div>
<!-- Added this extra div below and now able to scroll the last 2 parameters as well -->
<div style="height:50px;">
</div>

.scroll {
height:100%;
overflow:scroll; 
}

如果我做错了什么，有人可以告诉我吗？

Answer 1

可能的原因:

• margin-top: 100px 或 top: 100px 等垂直偏移与 height: 100% 结合使用 position:absolute；。在这种情况下更改为 height: calc(100% - 100px);

• 与padding-top 或padding-bottom 相同。可能的解决方案:box-sizing: border-box;

但是如果没有代码，这一切都是猜测......