Cannot make sticky sidebar work on live site/staging

Design help General
1

Hi everyone,

I know this is a widely discussed topic and I have tried many previous solutions given on this forum but I still cannot seem to make it work. I want to create a sticky sidebar, combined with the finnsweet filter and collection combined solution but it just does not stick. It works in the designer but not when I publish to staging.

If anyone has time to take a look and see what I am missing/doing wrong I would be very thankful. This is the read only link.

Thanks in advance !

2

Hi there,

If your sticky sidebar isn’t working as expected, here are the key points to check:

The sticky positioning requires proper setup of these elements:

  • Set a specific distance value (like top: 0px) for at least one side of the element
  • Ensure parent elements don’t have overflow set to hidden, scroll, or auto
  • Remove any fixed height constraints on parent elements

If you’re using flex or grid layouts, check that your alignment settings aren’t conflicting with the sticky positioning. You can review the documentation for flex and grid layouts for proper configuration.

For additional reference, you can check these helpful resources:

Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.

4

Hey @Sophie_van_Montfoor1 ,

Can you set the ‘page-transition’ element’s overflow property to visible and test this? You can find this property in the right side styling section.

6

Hi AJ,

Thanks for your reply!

I have tried that, and double checked all other parents for the overflow property = visible, but it still is not working. You can check it here.

Do you see anything else?

7

Hey @Sophie_van_Montfoor1 ,

You have a custom styling enabled probably in the site’s code section which is overriding the styling. So, can you include this in the Inside head tag section of the page’s custom code and this should help:

<style>
  .page-transition {
    overflow: visible !important;
  }
</style>

Let me know if you still face issues.

1 Like
8

Thank you!!! It worked

1 Like