Newbe Dev Stack

Answer : The sticky-top is working, but it doesn't appear to be working for two reasons... There isn't enough content in the main content area to scroll It's positioned at top:0 so it hides behind the fixed navbar Add CSS to offset the top of the sidebar (the same as height of fixed navbar). .sticky-offset { top: 56px; } <ul class="list-group sticky-top sticky-offset">..(sidebar)..</div> And, then add enough content (or height) in the main area so that scrolling is necessary... Working Demo: https://www.codeply.com/go/7XYosZ7VH5 <nav class="navbar navbar-expand-md navbar-dark bg-primary fixed-top"> .. </nav> <div class="row"> <div id="sidebar-container" class="sidebar-expanded col-2 d-none d-md-block"> <ul class="list-group sticky-top sticky-offset"> <li>Menu item..</li> <li>Menu item..<...

Answer : Bootstrap 3 Yes, it's possible. This "off-canvas" example should help to get you started. https://codeply.com/p/esYgHWB2zJ Basically you need to wrap the layout in an outer div, and use media queries to toggle the layout on smaller screens. /* collapsed sidebar styles */ @media screen and (max-width: 767px) { .row-offcanvas { position: relative; -webkit-transition: all 0.25s ease-out; -moz-transition: all 0.25s ease-out; transition: all 0.25s ease-out; } .row-offcanvas-right .sidebar-offcanvas { right: -41.6%; } .row-offcanvas-left .sidebar-offcanvas { left: -41.6%; } .row-offcanvas-right.active { right: 41.6%; } .row-offcanvas-left.active { left: 41.6%; } .sidebar-offcanvas { position: absolute; top: 0; width: 41.6%; } #sidebar { padding-top:0; } } Also, there are several more Bootstrap sidebar examples here Bootstrap 4 Create a responsive navbar sidebar "dra...