diff --git a/addons/website_payment/static/src/snippets/s_donation/000.js b/addons/website_payment/static/src/snippets/s_donation/000.js
index 97f30e9eb03f76b2e4e1c97fad6e7b7e95042c74..01d69d3b96428e718304914b5a4a52ab481a194c 100644
--- a/addons/website_payment/static/src/snippets/s_donation/000.js
+++ b/addons/website_payment/static/src/snippets/s_donation/000.js
@@ -3,6 +3,8 @@
 import {_t} from 'web.core';
 import publicWidget from 'web.public.widget';
 
+const CUSTOM_BUTTON_EXTRA_WIDTH = 10;
+
 publicWidget.registry.DonationSnippet = publicWidget.Widget.extend({
     selector: '.s_donation',
     disabledInEditableMode: false,
@@ -24,11 +26,23 @@ publicWidget.registry.DonationSnippet = publicWidget.Widget.extend({
             this._setBubble(this.$rangeSlider);
         }
         await this._displayCurrencies();
+        const customButtonEl = this.el.querySelector("#s_donation_amount_input");
+        if (customButtonEl) {
+            const canvasEl = document.createElement("canvas");
+            const context = canvasEl.getContext("2d");
+            context.font = window.getComputedStyle(customButtonEl).font;
+            const width = context.measureText(customButtonEl.placeholder).width;
+            customButtonEl.style.maxWidth = `${Math.ceil(width) + CUSTOM_BUTTON_EXTRA_WIDTH}px`;
+        }
     },
     /**
      * @override
      */
     destroy() {
+        const customButtonEl = this.el.querySelector("#s_donation_amount_input");
+        if (customButtonEl) {
+            customButtonEl.style.maxWidth = "";
+        }
         this.$target.find('.s_donation_currency').remove();
         this._deselectPrefilledButtons();
         this.$('.alert-danger').remove();