Troubleshooting: Mobile-specific issues
Common mobile UX problems and fixes.
Cart covers the keyboard
When a customer taps a text input (discount code, order notes), the keyboard pops up and may cover the input field. Fix: Use Bottom slide direction for the cart drawer. It handles keyboard interaction more gracefully than left/right slides.
Buttons too small
Mobile buttons should be at least 44px tall for accessibility. Fix: Increase the checkout button height in cart settings.
Sticky footer pushed off-screen
If your padding is too generous, the sticky footer (with the checkout button) can get pushed below the visible viewport on small phones. Fix: Reduce cart padding in design settings.
Drawer doesn't fit small screens
By default the drawer uses full width on mobile. If you've overridden width with custom CSS, that override might not respect mobile breakpoints. Test on a real device, not just resized desktop.
Always test on a real mobile device — not just Chrome's responsive mode. Touch behavior, keyboard, and viewport calculations differ.