【发布时间】:2022-06-15 17:31:09
【问题描述】:
我现在创建一个网站已经很长时间了。我用它做的最后一件事是让它在我的第二台较小的笔记本电脑上响应媒体查询。但是,我注意到当我在主计算机上打开该站点时出现了另一个滚动条。 2 个右侧滚动条不相关。
整个网站都在一个文件夹中,所以我不能真正共享 HTML/CSS 代码。首先,我想知道是否有人已经遇到过这种问题,并且可以建议我从哪里开始解决它。我猜我可能在 CSS 中创建了许多 body/html 规则?
谢谢!
【问题讨论】:
我现在创建一个网站已经很长时间了。我用它做的最后一件事是让它在我的第二台较小的笔记本电脑上响应媒体查询。但是,我注意到当我在主计算机上打开该站点时出现了另一个滚动条。 2 个右侧滚动条不相关。
整个网站都在一个文件夹中,所以我不能真正共享 HTML/CSS 代码。首先,我想知道是否有人已经遇到过这种问题,并且可以建议我从哪里开始解决它。我猜我可能在 CSS 中创建了许多 body/html 规则?
谢谢!
【问题讨论】:
所以基本上你在你的 div 上启用了溢出,默认值为 body。 因此你看到了 2 个滚动条。一个 div 和一个 body。
如果您通过禁用默认的 body 滚动条并保持 div 在 y 轴上可溢出来解决这个问题,那就太好了。
【讨论】:
不久前我也遇到过类似的问题。
为了获得更好的答案,我应该阅读代码,但我可以告诉您应该从哪里开始寻找问题。
这可能是因为您页面中的 div 具有诸如“overflow-y: auto”之类的规则,并且它的父级本身大于当前页面高度。
.container1 {
background-color: red;
height: 10000px;
width: 100%;
}
.container2 {
background-color: blue;
height: 100vh;
width: 100%;
overflow-y: auto;
}
.container3 {
background-color: green;
height: 10000px;
width: 50px;
}
<div class="container1">
<div class="container2">
<div class="container3">
</div>
</div>
</div>
我做了一个快速的 sn-p,您可以执行以更好地了解正在发生的事情。
我希望这可以帮助您找到问题。
【讨论】:
终于解决了。我不得不手动将
【讨论】: