How to make a sticky header but as a sidebar?

Hi Brandon,

Generally you achieve this the same way as sticky header but for sidebar container you must use some JS/jQuery code to handle with scroll event for change position parameter in css when you approach proper height.

For example:

// default styles for sidebar .sidebar { position: relative; top: 0; }

// jQuery code to run fixed position for sidebar $(document).ready(function() { $(window).scroll(function() {

 if ( $(window).scrollTop() > 20 ) {
   $('.sidebar').css('position', 'fixed');
 }
 else {
   $('.sidebar').css('position', 'relative');
 }

}); });

There is also a new way to make sticky sidebar is use position: sticky on your sidebar but it is not fully supported by browsers yet. This new feature does container positioned relative or fixed depending on how it appears in the viewport .

PS. I've also founded this https://github.com/wilddeer/stickyfill. It might help you.

This is more of a JS question, not WP :)