diff --git a/addons/website/static/src/js/content/menu.js b/addons/website/static/src/js/content/menu.js
index 88653d0263b..fd3c1aaf557 100644
--- a/addons/website/static/src/js/content/menu.js
+++ b/addons/website/static/src/js/content/menu.js
@@ -26,6 +26,7 @@ const BaseAnimatedHeader = animations.Animation.extend({
         this.hasScrolled = false;
         this.closeOpenedMenus = false;
         this.scrollHeightTooShort = false;
+        this.scrollableEl = $().getScrollingElement()[0];
     },
     /**
      * @override
@@ -135,6 +136,18 @@ const BaseAnimatedHeader = animations.Animation.extend({
             this.el.classList.remove('o_transitioning');
         }
     },
+    /**
+     * Scrolls to correctly display the section specified in the URL
+     *
+     * @private
+     */
+    _adjustUrlAutoScroll() {
+        // When the url contains #aRandomSection, prevent the navbar to overlap
+        // on the section, for this, we scroll as many px as the navbar height.
+        if (!this.editableMode) {
+            this.scrollableEl.scrollBy(0, -this.el.offsetHeight);
+        }
+    },
     /**
      * @private
      */
@@ -186,7 +199,7 @@ const BaseAnimatedHeader = animations.Animation.extend({
      * @returns {boolean}
      */
     _scrollHeightTooShort() {
-        const scrollEl = $().getScrollingElement()[0];
+        const scrollEl = this.scrollableEl;
         const remainingScroll = (scrollEl.scrollHeight - scrollEl.clientHeight) - this.scrolledPoint;
         const clonedHeader = this.el.cloneNode(true);
         scrollEl.append(clonedHeader);
@@ -213,6 +226,7 @@ const BaseAnimatedHeader = animations.Animation.extend({
             this.hasScrolled = true;
             if (scroll > 0) {
                 this.$el.addClass('o_header_no_transition');
+                this._adjustUrlAutoScroll();
             }
         } else {
             this.$el.removeClass('o_header_no_transition');
@@ -439,6 +453,10 @@ publicWidget.registry.DisappearingHeader = BaseDisappearingHeader.extend({
     // Private
     //--------------------------------------------------------------------------
 
+    /**
+     * @override
+     */
+    _adjustUrlAutoScroll() {},
     /**
      * @override
      */
@@ -462,6 +480,10 @@ publicWidget.registry.FadeOutHeader = BaseDisappearingHeader.extend({
     // Private
     //--------------------------------------------------------------------------
 
+    /**
+     * @override
+     */
+    _adjustUrlAutoScroll() {},
     /**
      * @override
      */