Willkommen, Gast
Angemeldet bleiben:

THEMA:

Cassiopeia: Sidebar soll sticky sein 12 Mär 2023 14:02 #50959

Ich möchte die Sidebar gerne «sticky» haben. Das heisst: sie soll beim Herunterscrollen nicht nach oben verschwinden, sondern an Ort und Stelle bleiben. Die Webseite benutzt das Template «Cassiopeia». Ich dachte, das sei ganz einfach zu bewerkstelligen
div.grid-child.container-sidebar-left {
  position: sticky;
}
oder
div.sidebar-left {
    position: sticky;
}
Leider haben beide Versionen keinerlei Wirkung. Zugegeben: ich bin kein CSS Spezialist. Vielleicht hat mir jemand einen Tipp? Würde mich freuen! Vielen Dank!

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Cassiopeia: Sidebar soll sticky sein 12 Mär 2023 16:29 #50960

Allerdings mit der Sidebar rechts:
.container-sidebar-right {
grid-area: side-r;
height: calc(100vh - 200px);
position: sticky;top: 200px; }
Joomla! 3: Professionelle Webentwicklung von David Jardin und Elisa Foltyn - das Standardwerk zu Joomla! 3
Wer nicht über den Anstand verfügt, ein kleines "Thänx" auszusprechen, muss sich nicht wundern, künftig ignoriert zu werden!
Kein Support via PM oder Mail. Entsprechende Anfragen werden ignoriert.
Folgende Benutzer bedankten sich: crimle

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Cassiopeia: Sidebar soll sticky sein 12 Mär 2023 16:36 #50961

Super! Funktioniert! Hier noch der Code, falls es die linke Sidebar sein sollte:
.container-sidebar-left {
    grid-area: side-l;
    height: calc(100vh - 200px);
    position: sticky;
    top: 200px;
}
Ich staune immer wieder, was Du alles weisst. Und was ich alles nicht weiss (und mithilfe von Google nicht finde).
Allerbesten Dank!

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Cassiopeia: Sidebar soll sticky sein 12 Mär 2023 16:36 #50962

Blöd, animierte GIFs gehen hier nicht, sonst hätte ich das Ergebnis zeigen können.
Es ist mit CSS Grid gemacht, deshalb geht es nicht so einfach, weil die Elemente immer versuchen, den gesamten Platz zu füllen. Deshalb muss ein bisschen beschissen werden. Und doch, ich hab die Lösung mit Google gefunden, und zwar hier
Joomla! 3: Professionelle Webentwicklung von David Jardin und Elisa Foltyn - das Standardwerk zu Joomla! 3
Wer nicht über den Anstand verfügt, ein kleines "Thänx" auszusprechen, muss sich nicht wundern, künftig ignoriert zu werden!
Kein Support via PM oder Mail. Entsprechende Anfragen werden ignoriert.

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

  • Seite:
  • 1