From ed21d55b64bf49fba158ca646da76b0884cdac84 Mon Sep 17 00:00:00 2001
From: Ricardo Metring <ricardometring@gmail.com>
Date: Mon, 15 Jul 2024 05:22:47 -0300
Subject: [PATCH] Fix Express Checkout Element button width (#9094)

---
 changelog/fix-9005-fix-ece-button-width       | 4 ++++
 client/checkout/express-checkout-buttons.scss | 8 ++++++++
 2 files changed, 12 insertions(+)
 create mode 100644 changelog/fix-9005-fix-ece-button-width

diff --git a/changelog/fix-9005-fix-ece-button-width b/changelog/fix-9005-fix-ece-button-width
new file mode 100644
index 00000000000..d6474e6cef0
--- /dev/null
+++ b/changelog/fix-9005-fix-ece-button-width
@@ -0,0 +1,4 @@
+Significance: minor
+Type: fix
+
+Fix Express Checkout Element button width.
diff --git a/client/checkout/express-checkout-buttons.scss b/client/checkout/express-checkout-buttons.scss
index 9cf1134ed5b..fb2c698c315 100644
--- a/client/checkout/express-checkout-buttons.scss
+++ b/client/checkout/express-checkout-buttons.scss
@@ -8,6 +8,14 @@
 	}
 }
 
+// This fixes width calculation issues inside the iframe for blocks and shortcode pages.
+.wcpay-payment-request-wrapper,
+.wc-block-components-express-payment__event-buttons {
+	.StripeElement iframe {
+		max-width: unset;
+	}
+}
+
 .woocommerce-checkout .wcpay-payment-request-wrapper {
 	margin-bottom: 1.5em;
 }