diff --git a/addons/web/static/src/legacy/js/libs/bootstrap.js b/addons/web/static/src/legacy/js/libs/bootstrap.js
index e8adeb1971e..20f28a1f506 100644
--- a/addons/web/static/src/legacy/js/libs/bootstrap.js
+++ b/addons/web/static/src/legacy/js/libs/bootstrap.js
@@ -153,10 +153,11 @@ ScrollSpy.prototype._activate = function (target) {
  * Bootstrap disables dynamic dropdown positioning when it is in a navbar. Here
  * we make this patch to activate this dynamic navbar's dropdown positioning
  * which is useful to avoid that the elements of the website sub-menus overflow
- * the page.
+ * the page. Note that when the menu is "hamburger" type, we leave dynamic
+ * positioning disabled.
  */
 Dropdown.prototype._detectNavbar = function () {
-    return false;
+    return this._element.closest(".navbar-collapse.show");
 };
 
 /* Bootstrap modal scrollbar compensation on non-body */
diff --git a/addons/website/static/src/js/content/menu.js b/addons/website/static/src/js/content/menu.js
index fcecdb6d5c4..b4c3b9495f0 100644
--- a/addons/website/static/src/js/content/menu.js
+++ b/addons/website/static/src/js/content/menu.js
@@ -652,6 +652,51 @@ publicWidget.registry.HeaderMainCollapse = publicWidget.Widget.extend({
     },
 });
 
+publicWidget.registry.navbarDropdown = animations.Animation.extend({
+    selector: "header .navbar",
+    disabledInEditableMode: false,
+    events: {
+        "shown.bs.collapse": "_onCollapseShown",
+        "hidden.bs.collapse": "_onCollapseHidden",
+    },
+
+    //--------------------------------------------------------------------------
+    // Private
+    //--------------------------------------------------------------------------
+
+    /**
+     * Updates the Dropdowns to trigger the "_detectNavbar" function from the
+     * Bootstrap Dropdown class. This allows the dropdowns to adapt based on
+     * whether they are located within a hamburger menu. If they are not inside
+     * an "hamburger" style menu, automatic dropdown positioning is enabled
+     * using popper.js.
+     *
+     * @private
+     */
+    _updateDropdowns() {
+        for (const toggleEl of this.el.querySelectorAll(".nav .dropdown-toggle")) {
+            Dropdown.getOrCreateInstance(toggleEl).update();
+        }
+    },
+
+    //--------------------------------------------------------------------------
+    // Handlers
+    //--------------------------------------------------------------------------
+
+    /**
+     * @private
+     */
+    _onCollapseShown() {
+        this._updateDropdowns();
+    },
+    /**
+     * @private
+     */
+    _onCollapseHidden() {
+        this._updateDropdowns();
+    },
+});
+
 export default {
     extraMenuUpdateCallbacks: extraMenuUpdateCallbacks,
 };