diff --git a/src/components/Layout.js b/src/components/Layout.js
index 22b2b4d0c..1b312477f 100644
--- a/src/components/Layout.js
+++ b/src/components/Layout.js
@@ -23,7 +23,6 @@ const Layout = ({ children }) => {
       />
       <div className={cx(styles.main, 'site-container')}>
         <Sidebar className={cx(styles.sidebar, styles.hideOnMobile)} />
-        <div />
         <div
           className={cx(styles.contentContainer, {
             [styles.hideOnMobile]: isMobileNavOpen,
diff --git a/src/components/Layout.module.scss b/src/components/Layout.module.scss
index eea0c1f8d..3cd3f6376 100644
--- a/src/components/Layout.module.scss
+++ b/src/components/Layout.module.scss
@@ -1,5 +1,6 @@
 .layout {
   --global-header-height: 30px;
+  --sidebar-width: 300px;
 
   min-height: 100vh;
   display: grid;
@@ -7,8 +8,7 @@
 }
 
 .main {
-  display: grid;
-  grid-template-columns: 300px minmax(0, 1fr);
+  display: flex;
   width: 100%;
 
   @media screen and (max-width: 760px) {
@@ -20,13 +20,14 @@
   display: flex;
   flex-direction: column;
   padding: 2rem;
+  padding-left: calc(2rem + var(--sidebar-width));
 }
 
 .sidebar {
   position: fixed;
   top: var(--global-header-height);
   bottom: 0;
-  width: 300px;
+  width: var(--sidebar-width);
   height: calc(100vh - var(--global-header-height));
   overflow: auto;
 }