diff --git a/ghost/admin/assets/sass/layouts/default.scss b/ghost/admin/assets/sass/layouts/default.scss
index 3ffab74c3c..d9e6dd5cb3 100644
--- a/ghost/admin/assets/sass/layouts/default.scss
+++ b/ghost/admin/assets/sass/layouts/default.scss
@@ -23,7 +23,6 @@
     bottom: 0;
     left: 0;
     overflow: hidden;
-    z-index: 500; // Above the .global-nav when collapsed
     transition: transform $settings-menu-transition cubic-bezier($settings-menu-bezier);
 
     @media (max-width: 900px) {
@@ -56,6 +55,16 @@
     }
 }
 
+// A <span> that wraps the main {{outlet}} which created a new z-index stack, separate to the nav
+.viewport-content {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 500; // Above the .global-nav when collapsed
+}
+
 
 //
 // The header bar - visible below 900px
diff --git a/ghost/admin/templates/application.hbs b/ghost/admin/templates/application.hbs
index 05fee0818f..374005c6bc 100644
--- a/ghost/admin/templates/application.hbs
+++ b/ghost/admin/templates/application.hbs
@@ -7,7 +7,9 @@
 <main id="gh-main" class="viewport" role="main" {{bind-attr data-notification-count=topNotificationCount}}>
     {{gh-notifications location="top" notify="topNotificationChange"}}
     {{gh-notifications location="bottom"}}
-    {{outlet}}
+    <span class="viewport-content">
+        {{outlet}}
+    </span>
 </main>
 
 {{outlet modal}}