[Support request] Sticky Sidebar with Block Elements

[Thimo]

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!

[Ying]

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 🙂

[Thimo]

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.

[Ying]

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;
    }
}

[Thimo]

Hi Ying,

that worked perfectly. Thank you so much!

Have a nice day 😉

[Ying]

You are welcome Timo 🙂

[Author]

Posts