Color space between sidebar and footer

Hi there,

Try this CSS:
https://generatepress.com/forums/topic/extend-sidebar-to-bottom-of-page/#post-1212471

Adding CSS: https://docs.generatepress.com/article/adding-css/

Let me know if this helps :)

Yes, that would be what I was looking for...
But I have 2 problems with this CSS

1) Conflict with previous CSS I added, to fix the right sidebar:
@media (min-width: 769px) {
#right-sidebar {
position: -webkit-sticky;
position: sticky;
top: 6%;
}
}
Unfortunately this CSS (to fix the sidebar) doesn't work anymore in combination with the new CSS (to change color)

2) With the CSS you suggested, the sidebar doesn't go down in small screen, as you can see in this image

Can you keep my CSS in there so I can see the issue?

Ok, done

You can see the homepage in a mobile device (the sidebar doesn't go down)

And you can see in a page with long content (like this one ) that the sidebar doesn't stay sticky anymore

...the link of the page with long content:
http://squarci.info/effetto-serra-faq/

We would need to wrap my CSS in desktop media query only like this:

@media (min-width: 769px) {
    .site-content, #right-sidebar {
        display: flex;
    }
    #right-sidebar .inside-right-sidebar {
        display: flex;
        flex-direction: column;
    }
    #right-sidebar .widget:last-child {
        flex: 1;
    }
}

As for the sticky issue, unfortunately I don't see a solution to have both as my CSS simply extend the sidebar to the length of the content. The workaround would be to target my CSS to the short content pages only if that works for you?

Ok, now it works!
So I have to decide between extended or sticky sidebar.
I will make my decision
Thank you

No problem :)