页面无限扩展,没有粘性页眉

上次更新后,我遇到了一个奇怪的故障,不确定如何进一步调试。论坛链接是 https://community.make.com。现在,着陆页有一个固定的页眉,一切正常。但我想要的是着陆页上一个非固定的页眉。但现在,当我禁用固定声明时:

页面会一直延伸,我永远无法到达页脚:

我可以在另一个使用类似布局的页面上重现它,但在其他实例上却不行。所以这一定是我主题中声明了什么,但我不知道那可能是什么。有人有什么猜测吗?

更新了 OP 并删除了我之前的解决方案。

2 个赞

您好,

这似乎是由于 --header-offset 引起的。如果页眉不是固定的,在滚动时它会发生变化。我认为您需要修复 --header-offset 以使其在这些页面上正常工作。

也许是这样的::thinking:

html.desktop-view {
  --header-offset: 81px !important;
}
1 个赞

感谢您对此的关注,@Don!我也认为这与动态的 header-offset 声明有关。另一方面,您可以在 meta 或其他实例上将标题更改为非固定(non-sticky),这样就不会有问题。例如,在此实例上,我使用了类似的组件,但页面并没有因为非固定的标题而扩展:https://community.couchers.org/

所以我仍然想知道为什么在另一个主题中会出现这种情况。不过我也想知道 header-offset 值实际上是如何计算和使用的?

1 个赞

我明白了……:thinking: 我的下一个建议:slightly_smiling_face:

我现在也用另一个网站检查了。我认为侧边栏的新更改可能导致了这个问题。
https://community.couchers.org/ 这是一个不包含侧边栏代码的旧版本。

.sidebar-wrapper 的高度是:calc(100vh - var(--header-offset)) 我认为如果页眉不是固定的,这会在您滚动时将内容推开。

您可以将其设置为 height: 0;display: none

#main-outlet-wrapper .sidebar-wrapper {
  display: none;
}