diff --git a/addons/website/static/src/js/content/menu.js b/addons/website/static/src/js/content/menu.js
index 913740098b6..3034c2e5e70 100644
--- a/addons/website/static/src/js/content/menu.js
+++ b/addons/website/static/src/js/content/menu.js
@@ -34,6 +34,12 @@ publicWidget.registry.affixMenu = publicWidget.Widget.extend({
             $source.attr('data-target', targetIDSelector + '_clone');
             $target.attr('id', targetIDSelector.substr(1) + '_clone');
         });
+        // While scrolling through navbar menus, body should not be scrolled with it
+        this.$headerClone.find('div.navbar-collapse').on('show.bs.collapse', function () {
+            $(document.body).addClass('overflow-hidden');
+        }).on('hide.bs.collapse', function () {
+            $(document.body).removeClass('overflow-hidden');
+        });
 
         // Window Handlers
         $(window).on('resize.affixMenu scroll.affixMenu', _.throttle(this._onWindowUpdate.bind(this), 200));
diff --git a/addons/website/static/src/scss/website.scss b/addons/website/static/src/scss/website.scss
index e384e8df34b..5fb20b332c8 100644
--- a/addons/website/static/src/scss/website.scss
+++ b/addons/website/static/src/scss/website.scss
@@ -1050,6 +1050,12 @@ table.table_desc tr td {
     background: $light;
     margin-top: -999px;
     transition: margin-top 500ms ease 0s;
+    @include media-breakpoint-down(sm) {
+        .navbar-collapse {
+            max-height: 70vh;
+            overflow-y: auto;
+        }
+    }
     &.affixed {
         margin-top: 0px !important; // the default margin-top is adapted in JS
     }