diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 26ce94f20c..2484f24439 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -27,9 +27,10 @@
         <section id="body">
         <div id="overlay"></div>
 
-        <div class="padding highlightable">
-
-            <div id="top-bar">
+        <div class="padding highlightable sticky-parent">
+            
+            <div class="sticky-spacer">
+              <div id="top-bar">
               {{ if and .IsPage .Site.Params.editURL }}
                 {{ $File := .File }}
                 {{ $Site := .Site }}
@@ -71,6 +72,7 @@
               {{ if .Params.toc }}
                   {{ partial "toc.html" . }}
               {{ end }}
+            </div>
 
             </div>
             {{ if $isChapter }}
diff --git a/static/js/hugo-learn.js b/static/js/hugo-learn.js
index 2067f256fc..b579d05bc5 100644
--- a/static/js/hugo-learn.js
+++ b/static/js/hugo-learn.js
@@ -56,7 +56,10 @@ images.each(function(index){
 });
 
 // Stick the top to the top of the screen when  scrolling
-$("#top-bar").stick_in_parent({spacer: false});
+$("#top-bar").stick_in_parent( {
+  parent: ".sticky-parent",
+  spacer: ".sticky-spacer",
+});
 
 
 jQuery(document).ready(function() {