Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
I added some css to my add to add to cart and buy now and made the section fixed on bottom, now my 2nd section which is Recommended products and the footer payment icons are overlapping the sticky bar whenever I scroll down. I tried with z-index as well as positions, didn't work for me.
Please see the replicated issue here: https://carbonvelocity.com/products/lorem-ipsum-dolor-sit-amet
Solved! Go to the solution
This is an accepted solution.
Hey @siddharthbhan
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag
<style>
.scroll-trigger:not(.scroll-trigger--offscreen).animate--slide-in {
z-index: 1;
}
product-recommendations.related-products.page-width.section-template--19964272673083__related-products-padding.isolate.scroll-trigger.animate--slide-in.product-recommendations--loaded {
z-index: 0;
}
</style>
If I managed to help you then, don't forget to Like it and Mark it as Solution!
Best Regards,
Moeed
This is an accepted solution.
Hey @siddharthbhan
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag
<style>
.scroll-trigger:not(.scroll-trigger--offscreen).animate--slide-in {
z-index: 1;
}
product-recommendations.related-products.page-width.section-template--19964272673083__related-products-padding.isolate.scroll-trigger.animate--slide-in.product-recommendations--loaded {
z-index: 0;
}
</style>
If I managed to help you then, don't forget to Like it and Mark it as Solution!
Best Regards,
Moeed
Hey Moeed,
Thanks for the help, this is working perfectly fine for me. I initially tried the same thing in base.css but it did not work. How come this works and that did not?
@siddharthbhan We recently released a sticky cart app with a free plan you can use that instead, check it out: https://apps.shopify.com/pasilobus-sticky-cart
Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025Discover opportunities to improve SEO with new guidance available from Shopify’s growth...
By Jacqui May 1, 2025