Can't scroll down to checkout button on mobile with more than 4 items in cart

Store Design
1

When I put more than 4 items in my cart, I can’t scroll down to see the Checkout button when viewing my cart on Mobile.

When I try scrolling, it moves the background page, but not the cart.

I tried Safari and Edge.

Help! :slightly_smiling_face:

2

@micahsa

sorry for that issue can you try this code .

  1. Go to Online Store->Theme->Edit code
  2. Asset->/styles.css->paste below code at the bottom of the file.
#theme-ajax-cart {
    overflow-y: auto;
}
1 Like
3

Hi @KetanKumar , so I only have a Styles.css.liquid, will the code work the same?

1 Like
4

@micahsa

yes, please add work as well

1 Like
5

Ok, I did, and it resolved the mobile scrolling, but it has caused an issue with viewing on the web browser.

Essentially, if I open up the cart flyout, it scrolls fine, but when I hover my curser over any part of the webpage behind it, it will initiate a scroll of that background page, and eventually it can’t seem to decide which one to prioritize for scrolling. Sample of what’s happening in this video:

https://www.screencast.com/t/SncArIUq

1 Like
6

@micahsa oh sorry can you please add this code also

#theme-ajax-cart {z-index: 6666666666;}
.ajax-cart__overlay {z-index: 55555;}
1 Like
7

Wonderful, thank you! It works great now.

1 Like
8

@micahsa

its my pleasure to help us

1 Like