diff --git a/docs/lib/UI/Content.js b/docs/lib/UI/Content.js
index 76450a5ae..c7dba8dcd 100644
--- a/docs/lib/UI/Content.js
+++ b/docs/lib/UI/Content.js
@@ -13,7 +13,7 @@ function Content({ items, children, title }) {
   return (
     <Container className="content">
       <Row>
-        <Col tag="main" md={{ size: 3, order: 2 }}>
+        <Col className="docSearch-navigation" tag="main" md={{ size: 3, order: 2 }}>
           <div className="docs-sidebar mb-3">
             <h1 className="h5">{title}</h1>
             <Nav className="flex-column">
diff --git a/docs/static/docs.css b/docs/static/docs.css
index 252efd3c0..2287fe999 100644
--- a/docs/static/docs.css
+++ b/docs/static/docs.css
@@ -37,6 +37,17 @@
   margin-top: 2rem;
 }
 
+@media(min-width: 768px) {
+  html,body,#app,#app > .wrapper,#app >.wrapper > .container,  #app >.wrapper > .container > .row{
+    height:100%;
+  }
+  .docSearch-navigation, .docSearch-content {
+    overflow-y: scroll;
+    height:100%;
+  }
+}
+
+
 .header .navbar-nav .nav-link.active {
   color: #333;
 }