"Proceed to Checkout" button not working on mobile devices

[samstone87]

Hi,

The “proceed to checkout” button isn’t working on my iPhone or when my browser on my desktop is less than 750 px wide when I view my cart at https://artbysusanstone.com/cart/. the “apply coupon” button seems to work just fine.

Someone did mention in a ticket back in January that it was an empty <div> causing the issue, but I can’t seem to figure out what that one is. And they didn’t mention it either (https://theme.co/apex/forum/t/proceed-to-chekout-button-not-working/19703)

I haven’t done any customization to my Woocommerce files or anything like that. It’s literally just the shortcode the Woocommerce cart on that page. Definitely want this updated bc I’m afraid it would cause a drop off in customers checking out if it isn’t addressed.

Thanks in advance!

[paul.r]

Hi,

I checked and the can see that the empty column(div) is covering the button preventing it from working.

To fix this, you can add the code below in Theme Options > CSS

 @media (max-width: 767px) {
.single-product .x-column.x-sm {
    overflow: hidden;
    clear: both;
}
}

Hope that helps.

[samstone87]

Ah! Thanks @paul.r ! I didn’t think about the column being empty potentially causing issues. I just liked the the thinner set up when it was in 2 columns.

[christopher]

Glad that we could be of a help