react-stripe-js icon indicating copy to clipboard operation
react-stripe-js copied to clipboard

[BUG]: ExpressCheckoutElement Inconsistent Row Rendering

Open StevenGlrz opened this issue 4 months ago • 0 comments

What happened?

I have the following

<ExpressCheckoutElement
      options={{
          layout: {
              overflow: "never",
              maxColumns: 0,
          },
          buttonType: {
              applePay: "book",
              googlePay: "book"
          },
          buttonHeight: 40,
          paymentMethods: {
              applePay: "always",
              googlePay: "always",
              link: "never"
          }
      }}
/>

which renders apple pay and google pay buttons in one row as expected

Screenshot 2024-10-08 at 11 59 26 PM

But if I change buttonType from book to plain, it renders on two rows. I would expect this to still render in one row.

Screenshot 2024-10-09 at 12 00 18 AM

Environment

Safari & Chrome

Reproduction

No response

StevenGlrz avatar Oct 09 '24 04:10 StevenGlrz