Cassiopeia: Sidebar soll sticky sein
- crimle
-
Autor
- Offline
-
Weniger
Mehr
12 März 2023 14:02 #50959
von crimle
Cassiopeia: Sidebar soll sticky sein wurde erstellt von crimle
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
oder
Leider haben beide Versionen keinerlei Wirkung. Zugegeben: ich bin kein CSS Spezialist. Vielleicht hat mir jemand einen Tipp? Würde mich freuen! Vielen Dank!
Code:
div.grid-child.container-sidebar-left {
position: sticky;
}
Code:
div.sidebar-left {
position: sticky;
}
Bitte Anmelden oder Registrieren um der Konversation beizutreten.
- Chris Hoefliger
-
- Offline
-
12 März 2023 16:29 - 12 März 2023 16:36 #50960
von Chris Hoefliger
Chris Hoefliger antwortete auf Cassiopeia: Sidebar soll sticky sein
Allerdings mit der Sidebar rechts:
Code:
.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.
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.
- crimle
-
Autor
- Offline
-
12 März 2023 16:36 #50961
von crimle
crimle antwortete auf Cassiopeia: Sidebar soll sticky sein
Super! Funktioniert! Hier noch der Code, falls es die linke Sidebar sein sollte:
Ich staune immer wieder, was Du alles weisst. Und was ich alles nicht weiss (und mithilfe von Google nicht finde).
Allerbesten Dank!
Code:
.container-sidebar-left {
grid-area: side-l;
height: calc(100vh - 200px);
position: sticky;
top: 200px;
}
Allerbesten Dank!
Bitte Anmelden oder Registrieren um der Konversation beizutreten.
- Chris Hoefliger
-
- Offline
-
12 März 2023 16:36 - 12 März 2023 16:39 #50962
von Chris Hoefliger
Chris Hoefliger antwortete auf Cassiopeia: Sidebar soll sticky sein
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
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.
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.
Moderatoren: Chris Hoefliger, Tribal6, RePao, Dragonlord, pascale, adiheutschi.ch