Collin Duncan Collin Duncan - 1 year ago 76
CSS Question

Stripe Checkout Button Too Small on Mobile

I feel like I must be missing something incredibly simple. Whenever I attempt to implement Stripe's Checkout feature on a mobile site, the payment button appears very, very small.

I stripped everything away that might be causing styling issues and then just started using their basic embedded form just to see and I still get this problem where it just doesn't appear optimized for a mobile format.

What am I missing here?

<form id="buy" action="backend/create_subscription.php" method="post">
src="" class="stripe-button"
data-description="Some widget"
data-label="Option 1"

Image of the tiny button on mobile

Answer Source

This isn't a button issue, it's a scaling issue. You might want to try this in your <head>:

 <meta name="viewport" content="width=device-width, initial-scale=1">

That should (probably?) help with scaling. You could also do a Custom integration and that will allow you to use whatever button you want to trigger it.