Archived topic
Sticky Sidebar with Block Elements
5 replies · Started by Thimo on March 2, 2021
Hi there,
I have build my sidebars using the block element feature, Now I want the last element in my post sidebar (related posts) to be sticky. I already tried several CSS snippets I found but so far, nothing worked. Could you help me out?
Here is an example of a post where I would like to have a sticky element in the right sidebar: https://pingpong-guide.com/11-reasons-why-table-tennis-is-fun/
Love your Theme!
Hi Thimo,
Did you just add some CSS into GB container's Additional CSS class(es)? That field is for class, not for css code.
Could you remove them first?
https://www.screencast.com/t/p3BOEMhnV
The right place to add CSS code is customizer > additional CSS.
Let me know :)
Hi Ying,
wow, thanks for the quick reply and the advice. I have tried both CSS fields just forgot to delete the code I entered. I removed the code.
Give this CSS a try :) You could change the number after topto adjust the sticky position.
@media (min-width: 769px) {
.inside-right-sidebar {
flex: 1;
height: 100%;
}
.gb-container-b9b22c09, .gb-container-06e4c94d {
position: sticky;
z-index: 20;
}
.gb-container-b9b22c09 {
top: 100px;
}
.gb-container-06e4c94d {
top: 10px;
}
}Hi Ying,
that worked perfectly. Thank you so much!
Have a nice day ;)
You are welcome Timo :)
