Show Sidebar Scrollbar with Icon Stack

[simeoned]

When using the Icon stack with sidebar left configured with enough content to cause scrolling, there is no scrollbar set by default. OK no big deal… I’ll just set my CSS and turn it on:

aside.nano{overflow-y:scroll}

Well, that does turn the scrollbar track. That is, the space where the scrollbar thumb should be is activated. But there is no thumb in that space.

OK so, to define “thumb”: The Thumb is the little indicator that tracks with the user as they scroll down to indicate where on the page the user has scrolled to. It’s height changes according to how much content is beyond the current viewport to indicate how much of said content exists.

I even tried using a jQuery plugin to force a fully customized scrollbar (which is ultimately my goal but not important to solve right now - default scrollbar with visible thumb would be just fine), but no joy.

Can anyone shed some light on this please? How can I get the sidebar’s vertical scrollbar to show and display the thumb like normal? Thanks!

[ruenel]

Hello There,

Thank you for the very detailed post information.

To force the vertical scrollbar to display, please make use of this code along with your code:

::-webkit-scrollbar {
        -webkit-appearance: none;
        width: 7px;
    }
    ::-webkit-scrollbar-thumb {
        border-radius: 4px;
        background-color: rgba(0,0,0,.5);
        -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
    }

Hope this helps.