diff --git a/ui/v2.5/src/components/Shared/styles.scss b/ui/v2.5/src/components/Shared/styles.scss
index 55dff9d0f..947dd22d7 100644
--- a/ui/v2.5/src/components/Shared/styles.scss
+++ b/ui/v2.5/src/components/Shared/styles.scss
@@ -828,7 +828,6 @@ button.btn.favorite-button {
   }
   @include media-breakpoint-down(xs) {
     .sidebar {
-      margin-bottom: $navbar-height;
       margin-top: 0;
     }
   }
@@ -920,12 +919,16 @@ $sticky-header-height: calc(50px + 3.3rem);
 }
 
 .detail-body {
+  .sidebar-pane {
+    position: sticky;
+    top: calc($sticky-detail-header-height + $navbar-height);
+  }
+
   .sidebar {
     // required for sticky to work
     align-self: flex-start;
 
     // take a further 15px padding to match the detail body
-    height: calc(100vh - $sticky-header-height - 15px);
     margin-top: -15px;
     max-height: calc(100vh - $sticky-header-height - 15px);
     overflow-y: auto;
@@ -939,6 +942,10 @@ $sticky-header-height: calc(50px + 3.3rem);
     }
   }
 
+  .sidebar-pane:not(.hide-sidebar) .sidebar {
+    height: calc(100vh - $sticky-header-height - 15px);
+  }
+
   .sidebar-pane.hide-sidebar .sidebar {
     left: -$sidebar-width;
     margin-left: calc(-15px - $sidebar-width);
@@ -955,6 +962,10 @@ $sticky-header-height: calc(50px + 3.3rem);
     }
   }
   @include media-breakpoint-down(xs) {
+    .sidebar-pane {
+      top: 0;
+    }
+
     .sidebar {
       // flex: 100% 0 0;
       height: calc(100vh - $navbar-height);