Seite dehnt sich endlos ohne Sticky Header aus

Nach dem letzten Update habe ich einen seltsamen Glitch und bin mir nicht sicher, wie ich ihn weiter debuggen kann. Der Forenlink ist https://community.make.com. Jetzt hat die Landingpage einen festen Header und alles funktioniert einwandfrei. Aber was ich hatte und eigentlich will, ist ein nicht fester Header auf der Landingpage. Aber jetzt, wenn ich die feste Deklaration deaktiviere:

dann dehnt sich die Seite immer weiter aus und ich erreiche nie ihren Footer:

Ich kann es auf einer anderen Seite reproduzieren, auf der ich ein ähnliches Layout verwende, aber nicht auf anderen Instanzen. Es muss also etwas sein, das ich im Theme deklariere, aber ich bin ratlos, was es sein könnte. Hat jemand eine Vermutung?

Die OP wurde aktualisiert und meine vorherige Lösung entfernt.

2 „Gefällt mir“

Hallo,

Es scheint, dass dies den --header-offset verursacht. Wenn die Kopfzeile nicht fixiert ist, ändert sie sich beim Scrollen. Ich denke, Sie müssen den --header-offset für diese Seiten festlegen.

Vielleicht so etwas:thinking:

html.desktop-view {
  --header-offset: 81px !important;
}
1 „Gefällt mir“

Vielen Dank, dass Sie sich das angesehen haben, @Don! Ich dachte auch, es hätte mit der dynamischen Header-Offset-Deklaration zu tun. Andererseits kann man den Header hier auf Meta oder anderen Instanzen auf nicht-sticky umstellen und es gibt kein Problem. Z.B. auf dieser Instanz verwende ich ähnliche Komponenten, aber die Seite erweitert sich nicht mit einem nicht-sticky Header: https://community.couchers.org/

Daher frage ich mich immer noch, warum bei diesem anderen Theme. Obwohl ich mich auch frage, wofür der Header-Offset-Wert eigentlich berechnet und verwendet wird?

1 „Gefällt mir“

Ich verstehe… :thinking: Mein nächster Tipp :slightly_smiling_face:

Ich habe es jetzt auch mit der anderen Seite überprüft. Ich denke, die neuen Änderungen am Sidebar könnten das verursachen.
https://community.couchers.org/ Dies ist eine ältere Version, die keinen Sidebar-Code enthält.

.sidebar-wrapper hat eine Höhe von calc(100vh - var(--header-offset)). Ich denke, das verschiebt den Inhalt, während Sie scrollen, wenn der Header nicht fixiert ist.

Sie können height: 0; oder display: none setzen.

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