Archived topic
Stick last widgets in right sidebar not working
7 replies · Started by Pintu on September 14, 2022
Hi, I've added the following CSS to make the last widget sticky (AdSense Ad Code) in my sidebar
@media(min-width: 769px) {
.inside-right-sidebar {
height: 100%;
}
.inside-right-sidebar .widget:last-child {
position: -webkit-sticky;
position: sticky;
top: 60px;
}
}
But it's not working. Please help
Hi Pintu,
Can you try #1 here?: https://docs.generatepress.com/article/debugging-tips/
Something is adding an inline style height to your inside-right-sidebar which is not default and causing the code not to work.
Found out the cause. I was using another Responsive ad unit above the sticky ad, just removed it, and it is now fine.
I see. Glad you found the issue.
Hi, though the Ad is now sticky it is not center aligned.
I've added the <div align="center"> and </div> but still it is not in center.
Try to add this CSS:
.inside-right-sidebar .widget > div {
display: flex;
justify-content: center;
}
Yes, it worked!
So, can I now remove <div> and </div> from the HTML?
Thanks.
You can remove that, and change this:
.inside-right-sidebar .widget:last-child {
position: -webkit-sticky;
position: sticky;
top: 60px;
}
to this:
.inside-right-sidebar .widget:last-child {
position: -webkit-sticky;
position: sticky;
top: 60px;
display: flex;
justify-content: center;
}
and see if it works.