diff --git a/src/dashboard/Dashboard.scss b/src/dashboard/Dashboard.scss
index 3ba8ac0559..b517ad6708 100644
--- a/src/dashboard/Dashboard.scss
+++ b/src/dashboard/Dashboard.scss
@@ -8,6 +8,8 @@
 .content {
   margin-left: 300px;
   transition: margin-left 0.5s ease-in;
+  overflow: auto;
+  max-height: 100vh;
 }
 
 @media (max-width: 980px) {
diff --git a/src/dashboard/Data/ApiConsole/ApiConsole.scss b/src/dashboard/Data/ApiConsole/ApiConsole.scss
index 8c838b0928..f46c00e3cd 100644
--- a/src/dashboard/Data/ApiConsole/ApiConsole.scss
+++ b/src/dashboard/Data/ApiConsole/ApiConsole.scss
@@ -25,10 +25,11 @@
   position: relative;
   height: calc(100vh - 96px);
   margin-top: 96px;
+  overflow: hidden;
 
   // Workaround to override graphql-playground-react
   // animations and query editor height
-  & > div > div {
+  & > div:not(.empty) > div {
     opacity: 1;
     transform: unset;
     animation: unset;