How to hide scrollbar but still scroll

1. How do I hide scrollbar and still scroll?
2. How do I show scrollbar only when needed?

How do I hide scrollbar and still scroll?

To make it invisible without impacting scrolling, you just have to target the body element using the ::-webkit-scrollbar pseudo selector and set the display to none . As you can see below, the scrollbar is no longer visible, but the page is still scrollable for both the mouse and keyboard.

How do I show scrollbar only when needed?

Use overflow: auto . Scrollbars will only appear when needed. (Sidenote, you can also specify for only the x, or y scrollbar: overflow-x: auto and overflow-y: auto ).