diff --git a/apps/client/src/widgets/containers/content_header.css b/apps/client/src/widgets/containers/content_header.css
index b264f5ae9..88ef5f572 100644
--- a/apps/client/src/widgets/containers/content_header.css
+++ b/apps/client/src/widgets/containers/content_header.css
@@ -1,6 +1,6 @@
 .content-header-widget {
     position: relative;
-    z-index: 8;
+    z-index: 998;
     background-color: var(--main-background-color);
 }
 
diff --git a/apps/client/src/widgets/containers/content_header.ts b/apps/client/src/widgets/containers/content_header.ts
index cc2a3623f..18e864c67 100644
--- a/apps/client/src/widgets/containers/content_header.ts
+++ b/apps/client/src/widgets/containers/content_header.ts
@@ -45,9 +45,12 @@ export default class ContentHeader extends Container<BasicWidget> {
     updateScrollState() {
         const currentScrollTop = this.parentElement!.scrollTop;
         const isScrollingUp = currentScrollTop < this.previousScrollTop;
+        const hasDropdownOpen = this.thisElement!.querySelector(".dropdown-menu.show") !== null;
         const hasMovedEnough = Math.abs(currentScrollTop - this.previousScrollTop) > this.scrollThreshold;
 
-        if (currentScrollTop === 0) {
+        if (hasDropdownOpen) {
+            this.setFloating(true);
+        } else if (currentScrollTop === 0) {
             this.setFloating(false);
         } else if (hasMovedEnough) {
             this.setFloating(isScrollingUp);