@henrymcgillis (Henry Gillis) posted a new topic, subject "Ecommerce Cart does not work with position: fixed". It read:

   **Link to read only site here:LINK**
    
    **What I'm trying to achieve:**
    
      * A cart Button that has a position fixed within my navigation structure.
      * Clicking on this button should open the Cart Modal fullscreen.
    
    
    
    **The Problem:**
    
      * The cart Modal does not open, or only opens inside the constraints of the fixed parent container.
    
    
    
    **What I've tried so far:**
    
      * Putting the cart inside the navigation container. Sadly this opens the modal only within the constraints of this parent container
      * putting the cart in a fixed parent container outside the navigation. Sadly this opens the modal only within the constraints of this parent container
      * giving the cart button a position of fixed and leaving the parent container static. The cart button does not show up. Or elements are not clickable depending on the z-index.
      * putting the cart in a fixed parent container that stretches over the whole screen. Giving the cart button a position of fixed. But then the cart button itself does not show up.
    
    
    
    **Is there anything I can do here?**  
    It seems like this should be achievable easily, but I don't think this works properly in webflow.
    
    image2330×1540 301 KB
    
      
    
    
    image798×552 26.9 KB
    
    * * *
    
    Here is my site Read-Only: **LINK**

So @henrymcgillis (Henry Gillis) replied

    I did some more testing and and narrowed the problem down to animations.
    
      * If you have a move animation on the parent container, it breaks the modal.
      * Apparently it works with opacity animations.
    
    
    
    Seems like a bug to me. Animating a cart should not break the cart.

After which, @drew-flps (Drew Eastmead) added

    I've had similar issues with the cart. Tried a bunch of things as you did. It's pretty terrible if you ask me. Here is my issue (similar to yours): Cart wrapper is stuck at top of page

After which, @henrymcgillis (Henry Gillis) added

    Damn… I agree.  
    I found kind of a workaround. I animated the cart container seperately from the cart button. This works for me even if it's not ideal atm

Then @drew-flps (Drew Eastmead) said

    Vielen Dank! I will experiment with that. Your website's design ist sehr schön.

To which @drew-flps (Drew Eastmead) replied

    Finally got the cart to work on desktop!
    
      1. I made the “section” layer (which contains the Cart) have a position of “sticky.”
      2. I also made the div block called “Cart Form Wrapper” have a position of “sticky.”
    
    
    
    Link to read only site

@system (system) replied

    This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.


{'source': 'discourse', 'url': 'https://discourse.webflow.com/t/ecommerce-cart-does-not-work-with-position-fixed/119168', 'title': 'Ecommerce Cart does not work with position: fixed', 'views': 1342, 'has_accepted_answer': False, 'word_count': 445, 'like_count': 4, 'reply_count': 4, 'participant_count': 2, 'posts': 7, 'tags': '', 'author': '@henrymcgillis (Henry Gillis)', 'participants': '@henrymcgillis (Henry Gillis), @drew-flps (Drew Eastmead), @system (system)', 'image_url': ['https://global.discourse-cdn.com/business5/uploads/webflow1/optimized/3X/a/4/a43707c28829e69af755bb3a5b2a8d10daa5442f_2_1024x676.png'], 'created_at': '2020-05-04T14:03:59.935Z', 'last_posted_at': '2020-07-04T16:03:50.941Z'}