Cart overflow hidden?

Got a bit of a strange issue here that has seemed to have just randomly appeared. Whenever I open the cart on the live preview or published site, it seems to be cut off by the nav-bar. There doesn’t seem to be an overflow:hidden causing this so unsure if this is a bug or not?

I’ve also noticed that when I select the cart button in the designer and click “open cart” the issue isn’t there.

Read only link is below if anyone could please take a look?


Here is my site Read-Only: https://preview.webflow.com/preview/ekolife?utm_medium=preview_link&utm_source=designer&utm_content=ekolife&preview=b898fb2a32ea086335f5701ddf1783cb&mode=preview

Nevermind just figured it out, I had the nav menu animating from off screen and taking that off solved the problem. Unsure why this is the case as it was just a transform move animation but leaving this comment here in case someone else has a similar issue.

@DavidFerguson I am having the exact same issue. I’m not quite sure how you fixed it from the comment. I have no animations on the nav bar really…

I ran into the same problem, and this works for me. However, it’s pretty frustrating that I cannot use the animation since I think it improves usability.

I’m having this same issue… a navbar that has a simple transform move on / off the screen on scroll. It seems to be cutting off the cart at the height of the ‘Cart Wrapper’, which automatically fills the height of the navbar.

It’s only happening on my ‘fixed-nav’, the one that follows you down the page. The static one at the top works fine.

Try to put a custom code below, this should help (I know it’s 11 months later, but for the community):

<style>
.w-commerce-commercecartcontainerwrapper {
height: 100vh !important;
}
</style>

Thanks a ton! I solved the issue after struggling for hours. I wonder why this bug haven’t been fixed already.

Same issue here in late 2024. I checked my backups (one from 7 hours ago before I added an interaction to the nav) and tested it. As soon as I add an interaction to the nav, it breaks the cart which then only shows within the nav at the top, so i 100% know what did it, however if I remove the animations the issue still exists. Don’t want to go back 7 hours of work

https://preview.webflow.com/preview/roguesgallery?utm_medium=preview_link&utm_source=designer&utm_content=roguesgallery&preview=79b18e634fbeffbada6bbb3b504e1769&pageId=673cb4d43da021733936056f&itemId=6740604882a32723d29a7bbf&locale=en&workflow=preview

If it helps anyone I had the same issue.

Turns out this was due to having backdrop filter involved, specifically in a parent div (the navbar) of the cart. I removed the backdrop filter from the nav, which was obsolete anyway and removed the backdrop filter from the interaction too, and all is well.

From webflow support " Upon researching this, it seems the root cause here is that there’s conflict between the CSS property filter and fixed child elements, I’ve found this post on Stack Overflow which explains this behavior: Why does applying a CSS-Filter on the parent break the child positioning? | Stack Overflow"