Hide Scrollbars but Keep Scrolling 🚀

Ever noticed how opening a sidebar sometimes makes the page jump or changes the layout because of the scrollbar? 😅

Here’s a neat trick: make the sidebar scrollable but hide the scrollbar completely. Your content stays scrollable, the page layout stays steady, and no annoying scrollbars ruin the design.

global.css:

.scrollbar-hide {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;     /* Firefox */
}

.scrollbar-hide::-webkit-scrollbar {
  display: none;             /* Chrome, Safari, Edge */
}        

Just add the scrollbar-hide class to your div or nav or scrollable container. Done ✅

Benefits:

• No scrollbar visible
• Smooth scrolling inside the sidebar
• Page layout won’t jump
• Works on all major browsers