diff --git a/build/scss/_main-header.scss b/build/scss/_main-header.scss
index 3769ef60d..262797eb1 100644
--- a/build/scss/_main-header.scss
+++ b/build/scss/_main-header.scss
@@ -49,6 +49,11 @@
       }
     }
   }
+
+  &.dropdown-legacy .dropdown-menu {
+    top: $nav-link-height + $navbar-padding-y;
+    margin-top: 0;
+  }
 }
 
 // Add this class to images within a nav-link
diff --git a/docs/components/main-header.md b/docs/components/main-header.md
index 26a0d8eed..e5e0242d4 100644
--- a/docs/components/main-header.md
+++ b/docs/components/main-header.md
@@ -570,4 +570,5 @@ Top navbar example can be found in this [demo page](https://adminlte.io/themes/d
 
 > ##### Tip!
 > To get a bigger dropdown menu you can add `.dropdown-menu-lg` or `.dropdown-menu-xl` to `.dropdown-menu`.
+> You can also get the legacy dropdown offset with adding `.dropdown-offset-legacy` to `.main-header`.
 {: .quote-info}