diff --git a/packages/core/chrome/core-chrome-browser-internal/src/ui/project/navigation.tsx b/packages/core/chrome/core-chrome-browser-internal/src/ui/project/navigation.tsx
index ae5c8c773e449..adc6b3f28c2e5 100644
--- a/packages/core/chrome/core-chrome-browser-internal/src/ui/project/navigation.tsx
+++ b/packages/core/chrome/core-chrome-browser-internal/src/ui/project/navigation.tsx
@@ -20,6 +20,7 @@ export const ProjectNavigation: React.FC = ({ children }) => {
 
   return (
     <EuiCollapsibleNavBeta
+      data-test-subj="projectLayoutSideNav"
       initialIsCollapsed={isCollapsed}
       onCollapseToggle={onCollapseToggle}
       css={isCollapsed ? { display: 'none;' } : {}}
diff --git a/src/core/public/styles/_base.scss b/src/core/public/styles/_base.scss
index 8b6fa71ce50fd..090ce072545ce 100644
--- a/src/core/public/styles/_base.scss
+++ b/src/core/public/styles/_base.scss
@@ -26,6 +26,11 @@
   margin-left: 320px; // Hard-coded for now -- @cchaos
 }
 
+// Add support for serverless nabbar
+.euiBody--hasFlyout .euiBottomBar {
+  margin-left: var(--euiCollapsibleNavOffset, 0);
+}
+
 // Temporary fix for EuiPageHeader with a bottom border but no tabs or padding
 // Will fix in EUI -- @cchaos
 .euiPageHeader--bottomBorder:not(.euiPageHeader--tabsAtBottom):not([class*='euiPageHeader--padding']) {