diff --git a/addons/web_editor/static/src/js/wysiwyg/widgets/link.js b/addons/web_editor/static/src/js/wysiwyg/widgets/link.js
index 76a8438d952..32f0ba20662 100644
--- a/addons/web_editor/static/src/js/wysiwyg/widgets/link.js
+++ b/addons/web_editor/static/src/js/wysiwyg/widgets/link.js
@@ -1,6 +1,8 @@
 /** @odoo-module **/
 
 import * as OdooEditorLib from "@web_editor/js/editor/odoo-editor/src/OdooEditor";
+import { _t } from "@web/core/l10n/translation";
+import { isVisible } from "@web/core/utils/ui";
 import weUtils from "@web_editor/js/common/utils";
 import {
     Component,
@@ -15,7 +17,6 @@ import {
 const getDeepRange = OdooEditorLib.getDeepRange;
 const getInSelection = OdooEditorLib.getInSelection;
 const EMAIL_REGEX = OdooEditorLib.EMAIL_REGEX;
-import { _t } from "@web/core/l10n/translation";
 
 /**
  * Allows to customize link content and style.
@@ -133,6 +134,15 @@ export class Link extends Component {
                 }
             }
         }
+        // When multiple buttons follow each other, they may break on 2 lines
+        // or more on mobile, so they need a margin-bottom.
+        if (data.classes.split(" ").includes("btn")) {
+            const closestButtonSiblingEls = this._getDirectButtonSiblings(this.linkEl);
+            if (closestButtonSiblingEls.length) {
+                data.classes += " mb-2";
+                closestButtonSiblingEls.forEach(btnEl => btnEl.classList.add("mb-2"));
+            }
+        }
         if (['btn-custom', 'btn-outline-custom', 'btn-fill-custom'].some(className =>
             data.classes.includes(className)
         )) {
@@ -552,16 +562,45 @@ export class Link extends Component {
         const allBtnColorPrefixes = /(^|\s+)(bg|text|border)(-[a-z0-9_-]*)?/gi;
         const allBtnClassSuffixes = /(^|\s+)btn(-[a-z0-9_-]*)?/gi;
         const allBtnShapes = /\s*(rounded-circle|flat)\s*/gi;
+        const btnMarginBottom = /(?<!\S)mb-2(?!\S)/i;
         this.state.className = this.state.iniClassName
             .replace(allBtnColorPrefixes, ' ')
             .replace(allBtnClassSuffixes, ' ')
-            .replace(allBtnShapes, ' ');
+            .replace(allBtnShapes, " ")
+            .replace(btnMarginBottom, " ");
         this.state.className += ' ' + keptClasses.join(' ');
         // 'o_submit' class will force anchor to be handled as a button in linkdialog.
         if (/(?:s_website_form_send|o_submit)/.test(this.state.className)) {
             this.state.isButton = true;
         }
     }
+    /**
+     * Returns an array of the buttons which are the closest non empty
+     * previousSibling and/or nextSibling.
+     *
+     * @param {HTMLElement} el
+     * @returns {HTMLElement[]}
+     */
+    _getDirectButtonSiblings(el) {
+        return ["previous", "next"].reduce((buttonSiblingsEls, side) => {
+            let siblingNode = el[`${side}Sibling`];
+            while (siblingNode) {
+                // If the node is an empty text node, or if it is a <br> tag or
+                // an invisible element, it is not taken into account.
+                if ((siblingNode.nodeType === 3 && !!siblingNode.textContent.match(/^\s*$/)) ||
+                        (siblingNode.nodeType === 1 &&
+                        (siblingNode.nodeName === "BR" || !isVisible(siblingNode)))) {
+                    siblingNode = siblingNode[`${side}Sibling`];
+                    continue;
+                }
+                if (siblingNode.nodeType === 1 && siblingNode.classList.contains("btn")) {
+                    buttonSiblingsEls.push(siblingNode);
+                }
+                break;
+            }
+            return buttonSiblingsEls;
+        }, []);
+    }
 
     //--------------------------------------------------------------------------
     // Handlers
diff --git a/addons/website/views/snippets/s_banner.xml b/addons/website/views/snippets/s_banner.xml
index 7cc6a07de67..fd7dfda7f2a 100644
--- a/addons/website/views/snippets/s_banner.xml
+++ b/addons/website/views/snippets/s_banner.xml
@@ -9,7 +9,7 @@
                 <div class="col-lg-6 jumbotron rounded o_cc o_cc1 pt32 pb32" data-name="Box">
                     <h1><font style="font-size: 62px;">Sell Online. Easily.</font></h1>
                     <p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
-                    <a t-att-href="cta_btn_href" class="btn btn-primary mb-2"><t t-esc="cta_btn_text">Contact Us</t></a>
+                    <a t-att-href="cta_btn_href" class="btn btn-primary"><t t-esc="cta_btn_text">Contact Us</t></a>
                 </div>
             </div>
         </div>
diff --git a/addons/website/views/snippets/s_call_to_action.xml b/addons/website/views/snippets/s_call_to_action.xml
index 4b610066860..10f0e240177 100644
--- a/addons/website/views/snippets/s_call_to_action.xml
+++ b/addons/website/views/snippets/s_call_to_action.xml
@@ -11,7 +11,7 @@
                 </div>
                 <div class="col-lg-3 pt8">
                     <p style="text-align: right;">
-                        <a t-att-href="cta_btn_href" class="btn btn-primary btn-lg mb-2"><t t-esc="cta_btn_text">Contact us</t></a>
+                        <a t-att-href="cta_btn_href" class="btn btn-primary btn-lg"><t t-esc="cta_btn_text">Contact us</t></a>
                     </p>
                 </div>
             </div>
diff --git a/addons/website/views/snippets/s_carousel.xml b/addons/website/views/snippets/s_carousel.xml
index 8476fb8afe4..e87a6db88a1 100644
--- a/addons/website/views/snippets/s_carousel.xml
+++ b/addons/website/views/snippets/s_carousel.xml
@@ -21,7 +21,7 @@
                                  <h2><font style="font-size: 62px;">Slide Title</font></h2>
                                 <p class="lead">Use this snippet to presents your content in a slideshow-like format. Don't write about products or services here, write about solutions.</p>
                                 <p>
-                                    <a href="/contactus" class="btn btn-primary mb-2">Contact us</a>
+                                    <a href="/contactus" class="btn btn-primary">Contact us</a>
                                 </p>
                             </div>
                         </div>
@@ -37,7 +37,7 @@
                                     <hr class="w-25 mx-auto" style="border-top-width: 1px; border-top-style: solid;"/>
                                 </div>
                                 <p class="lead">Storytelling is powerful.<br/> It draws readers in and engages them.</p>
-                                <p><a href="/" class="btn btn-primary mb-2">Start your journey</a></p>
+                                <p><a href="/" class="btn btn-primary">Start your journey</a></p>
                             </div>
                         </div>
                     </div>
diff --git a/addons/website/views/snippets/s_color_blocks_2.xml b/addons/website/views/snippets/s_color_blocks_2.xml
index cb8ef1e9b3e..3fec376dac2 100644
--- a/addons/website/views/snippets/s_color_blocks_2.xml
+++ b/addons/website/views/snippets/s_color_blocks_2.xml
@@ -9,13 +9,13 @@
                     <i class="fa fa-shield fa-5x m-3"/>
                     <h2>A color block</h2>
                     <p>Color blocks are a simple and effective way to <b>present and highlight your content</b>. Choose an image or a color for the background. You can even resize and duplicate the blocks to create your own layout. Add images or icons to customize the blocks.</p>
-                    <a href="#" class="btn btn-primary mb-2">More Details</a>
+                    <a href="#" class="btn btn-primary">More Details</a>
                 </div>
                 <div class="col-lg-6 o_cc o_cc5 text-center">
                     <i class="fa fa-cube fa-5x m-3"/>
                     <h2>Another color block</h2>
                     <p>Color blocks are a simple and effective way to <b>present and highlight your content</b>. Choose an image or a color for the background. You can even resize and duplicate the blocks to create your own layout. Add images or icons to customize the blocks.</p>
-                    <a href="#" class="btn btn-primary mb-2">More Details</a>
+                    <a href="#" class="btn btn-primary">More Details</a>
                 </div>
             </div>
         </div>
diff --git a/addons/website/views/snippets/s_comparisons.xml b/addons/website/views/snippets/s_comparisons.xml
index 02b9bb54b2f..30ca1432e43 100644
--- a/addons/website/views/snippets/s_comparisons.xml
+++ b/addons/website/views/snippets/s_comparisons.xml
@@ -24,7 +24,7 @@
                         </ul>
                         <div class="card-footer">
                             <p><i>Instant setup, satisfied or reimbursed.</i></p>
-                            <a href="/contactus" class="btn btn-primary mb-2">Order now</a>
+                            <a href="/contactus" class="btn btn-primary">Order now</a>
                         </div>
                     </div>
                 </div>
@@ -47,7 +47,7 @@
                         </ul>
                         <div class="card-footer">
                             <p><i>Instant setup, satisfied or reimbursed.</i></p>
-                            <a href="/contactus" class="btn btn-primary mb-2">Start now</a>
+                            <a href="/contactus" class="btn btn-primary">Start now</a>
                         </div>
                     </div>
                 </div>
@@ -70,7 +70,7 @@
                         </ul>
                         <div class="card-footer">
                             <p><i>Instant setup, satisfied or reimbursed.</i></p>
-                            <a href="/contactus" class="btn btn-primary mb-2">Contact us</a>
+                            <a href="/contactus" class="btn btn-primary">Contact us</a>
                         </div>
                     </div>
                 </div>
diff --git a/addons/website/views/snippets/s_cover.xml b/addons/website/views/snippets/s_cover.xml
index 0afcd95aef1..17f17da2b22 100644
--- a/addons/website/views/snippets/s_cover.xml
+++ b/addons/website/views/snippets/s_cover.xml
@@ -9,7 +9,7 @@
             <h1 style="text-align: center;"><font style="font-size: 62px; font-weight: bold;">Catchy Headline</font></h1>
             <p class="lead" style="text-align: center;">Write one or two paragraphs describing your product, services or a specific feature.<br/> To be successful your content needs to be useful to your readers.</p>
             <p style="text-align: center;">
-                <a t-att-href="cta_btn_href" class="btn btn-primary mb-2"><t t-esc="cta_btn_text">Contact us</t></a>
+                <a t-att-href="cta_btn_href" class="btn btn-primary"><t t-esc="cta_btn_text">Contact us</t></a>
             </p>
         </div>
     </section>
diff --git a/addons/website/views/snippets/s_image_text.xml b/addons/website/views/snippets/s_image_text.xml
index ee8dedf8f95..cea17f74a41 100644
--- a/addons/website/views/snippets/s_image_text.xml
+++ b/addons/website/views/snippets/s_image_text.xml
@@ -12,7 +12,7 @@
                     <h2>Section Subtitle</h2>
                     <p>Write one or two paragraphs describing your product or services. To be successful your content needs to be useful to your readers.</p>
                     <p>Start with the customer – find out what they want and give it to them.</p>
-                    <p><a href="#" class="btn btn-primary mb-2">Discover more</a></p>
+                    <p><a href="#" class="btn btn-primary">Discover more</a></p>
                 </div>
             </div>
         </div>
diff --git a/addons/website/views/snippets/s_media_list.xml b/addons/website/views/snippets/s_media_list.xml
index 176c1a165bb..0c200cf1561 100644
--- a/addons/website/views/snippets/s_media_list.xml
+++ b/addons/website/views/snippets/s_media_list.xml
@@ -13,7 +13,7 @@
                         <div class="col-lg-8 s_media_list_body">
                             <h3>Media heading</h3>
                             <p>Use this snippet to build various types of components that feature a left- or right-aligned image alongside textual content. Duplicate the element to create a list that fits your needs.</p>
-                            <a href="#" class="btn btn-primary mb-2">Discover</a>
+                            <a href="#" class="btn btn-primary">Discover</a>
                         </div>
                     </div>
                 </div>
diff --git a/addons/website/views/snippets/s_popup.xml b/addons/website/views/snippets/s_popup.xml
index f710d37f917..a786683475d 100644
--- a/addons/website/views/snippets/s_popup.xml
+++ b/addons/website/views/snippets/s_popup.xml
@@ -17,7 +17,7 @@
                                 <div class="col-lg-10 offset-lg-1 text-center o_cc o_cc1 jumbotron pt48 pb48">
                                     <h2><font style="font-size: 62px;">Win $20</font></h2>
                                     <p class="lead">Check out now and get $20 off your first order.</p>
-                                    <a href="#" class="btn btn-primary mb-2">New customer</a>
+                                    <a href="#" class="btn btn-primary">New customer</a>
                                 </div>
                             </div>
                         </div>
diff --git a/addons/website/views/snippets/s_showcase.xml b/addons/website/views/snippets/s_showcase.xml
index 4aab5d166ee..88f6da5e1cb 100644
--- a/addons/website/views/snippets/s_showcase.xml
+++ b/addons/website/views/snippets/s_showcase.xml
@@ -49,7 +49,7 @@
         </div>
         <div class="container text-lg-center">
             <p><br/></p>
-            <a href="#" class="btn btn-primary mb-2">Discover all the features</a>
+            <a href="#" class="btn btn-primary">Discover all the features</a>
         </div>
     </section>
 </template>
diff --git a/addons/website/views/snippets/s_text_cover.xml b/addons/website/views/snippets/s_text_cover.xml
index fc1dd862a80..eaa76f5fc97 100644
--- a/addons/website/views/snippets/s_text_cover.xml
+++ b/addons/website/views/snippets/s_text_cover.xml
@@ -8,7 +8,7 @@
                 <div class="o_colored_level o_cc o_cc_1 col-lg-4 pt160 pb160 px-5">
                     <h1><span style="font-size: 62px;">Sell Online. <br/>Easily.</span></h1>
                     <p class="lead">Write one or two paragraphs describing your product, services or a specific feature. To be successful your content needs to be useful to your readers.</p>
-                    <a t-att-href="cta_btn_href" class="btn btn-primary mb-2"><t t-esc="cta_btn_text">Contact us</t></a>
+                    <a t-att-href="cta_btn_href" class="btn btn-primary"><t t-esc="cta_btn_text">Contact us</t></a>
                 </div>
                 <div class="o_not_editable pt160 pb160 oe_img_bg col-lg-8 d-none d-md-block" style="background-image: url('/web/image/website.s_text_cover_default_image'); background-position: 100% 0;"/>
             </div>
diff --git a/addons/website/views/snippets/s_text_image.xml b/addons/website/views/snippets/s_text_image.xml
index 779a747d780..efbee3b12a2 100644
--- a/addons/website/views/snippets/s_text_image.xml
+++ b/addons/website/views/snippets/s_text_image.xml
@@ -9,7 +9,7 @@
                     <h2>A Section Subtitle</h2>
                     <p>Write one or two paragraphs describing your product or services. To be successful your content needs to be useful to your readers.</p>
                     <p>Start with the customer – find out what they want and give it to them.</p>
-                    <p><a href="#" class="btn btn-primary mb-2">Learn more</a></p>
+                    <p><a href="#" class="btn btn-primary">Learn more</a></p>
                 </div>
                 <div class="col-lg-6 pt16 pb16">
                     <img src="/web/image/website.s_text_image_default_image" class="img img-fluid mx-auto" alt=""/>