Search
Star
Feedback
Setup for Free
© 2026 Hedgehog Software, LLC
Twitter
GitHub
Discord
System
Light
Dark
More
Communities
Docs
About
Terms
Privacy
How to show scrollbar on hover only without any layout shift? - Kevin Powell - Community
KP-C
Kevin Powell - Community
•
2mo ago
•
6 replies
siduck
How to show scrollbar on hover only without any layout shift?
front-end
I have a sidebar
+content layout and I want to show scrollbar in sidebar only on hover
.
So by default it does layout shifting
, then I used
scrollable-gutter: stable
scrollable-gutter: stable
which works
but it removes my padding to the right
.
On macos scrollbars are hidden by default so even if i use stable gutter
+ padding
-right in sidebar
, it
'll look normal
but this same css would look double padding on other OS
's like windows or linux
how to resolve this
? I see component libraries like reka
-ui making a scroll component for this but i want to know if its possible to just do with css
?
https://codepen.io/sidhanth-rathod/pen/ByzpGBb
CodePen
sidhanth rathod
Untitled
.
.
.
Kevin Powell - Community
Join
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263
Members
View on Discord
Resources
ModelContextProtocol
ModelContextProtocol
MCP Server
Similar Threads
Was this page helpful?
Yes
No
Similar Threads
event.key === "Shift" vs event.shiftKey
KP-C
Kevin Powell - Community / help
2mo ago
How to remove a scrollbar UI inside an embed without removing scrolling?
KP-C
Kevin Powell - Community / help
4mo ago
Confused on how to approach this Layout
KP-C
Kevin Powell - Community / help
5mo ago
scrollbar-gutter
KP-C
Kevin Powell - Community / help
4mo ago