diff --git a/source/_static/js/main.js b/source/_static/js/main.js
index 87e61078..f685cb6f 100644
--- a/source/_static/js/main.js
+++ b/source/_static/js/main.js
@@ -14,7 +14,7 @@ window.addEventListener("DOMContentLoaded", (event) => {
   })();
 
   // --------------------------------------------------
-  // Dynamic sidebar scroll on read-mode.
+  // Dynamic sidebar scroll on non read-mode.
 	// This'll allow the sidebar to display all content,
 	// without scrolling the body. 
   // --------------------------------------------------
@@ -54,12 +54,21 @@ window.addEventListener("DOMContentLoaded", (event) => {
     
     // Make the sidebar is scrollable.
     sidebarEl.classList.remove("inactive");
+
+    // Scroll to hash
+    var hash = window.location.hash;
+    if (hash) {
+      var el = document.querySelector(hash);
+      if (el) {
+        el.scrollIntoView();
+      }
+    }
   }, 100);
 
   document.addEventListener("scroll", (e) => {
     setSidebarHeight();
   });
-
+ 
   // --------------------------------------------------
   // Read mode
   // --------------------------------------------------
diff --git a/source/_static/scss/includes/_layout.scss b/source/_static/scss/includes/_layout.scss
index 8cea21e7..d67d8657 100644
--- a/source/_static/scss/includes/_layout.scss
+++ b/source/_static/scss/includes/_layout.scss
@@ -48,6 +48,8 @@
         .content {
             @include breakpoint-min(breakpoints(lg)) { 
                 overflow: auto;
+                scroll-behavior: smooth;
+                scroll-padding: 2rem;
             }
 
             & > .container {