Show vertical scrollbar when side bar has many items about startbootstrap HOT 10 CLOSED

Just tested this and putting it here for anyone still interested.

.sidebar{
    overflow-y: scroll;
    position: fixed;
}

Then:

var topNavBar = 50;
var footer = 48;
var height = $(window).height();
$('.sidebar').css('height', (height - (topNavBar+footer)));

$(window).resize(function(){
    var height = $(window).height();
    $('.sidebar').css('height', (height - (topNavBar+footer)));
});

If you don't have a top navbar or footer, then just remove those.

from startbootstrap.

overflow:auto should do the trick. I will have to play around with it to make it work. We're working on a big update to Start Bootstrap at the moment and then we'll be revisiting all of our themes and patching up any small bugs/problems like this one.

from startbootstrap.

I'm going to keep this open for the time being as a "to-do" item.

from startbootstrap.

Thank you, please do keep up the good work.
In the meanwhile, I was able to work around this issue as follows:

.navbar-static-side {
height: 90%; /_Setting to 100% doesn't work, because of the margin-top:51px setting. The correct value should be 100%-51px, but I don't know how to set this with css :-( */
overflow-y: auto; /Show the scrollbar/
position: fixed; /_This did the trick! The original value was "absolute" /
margin-top:51px; / Original Value /
width:250px; / Original Value /
z-index: 1; / Original Value */
}

Please note that I am not a css expert, so the solution is a result of a "trial-and-error" approach.

from startbootstrap.

As an addition to the previous answer, height = 100% - 51px is specified like this (beware of browser support):
height: 90%;
height: calc(100% - 51px);

Also, for those using this scroll fix, the css should be placed inside the media query for navbar-static-side to not affect mobile behavior.

from startbootstrap.

In order to avoid further issues with the fixed side bar we're going back to static in the next release of SB Admin 2.

from startbootstrap.

@kyriakos77 what file did you add that in? I have the same problem but with sbadmin 1. I need to add a scrollbar to the menu but I cant find that class anywhere

from startbootstrap.

@cacpmw

Add the following to your css/scss:

.navbar-sidenav { overflow:hidden; }

This will add a hidden scrollbar to the sidenav. Adding a visible scrollbar throws off the tooltips when the sidenav is collapsed. I could not solve that part but would prefer the scrollbar to be visible if someone else has a solution.

from startbootstrap.

Caso esteja usando o bootstrap basta adicionar a classe pre-scrollable no sidebar

from startbootstrap.

You can add vertical scroll bar by adding this

    $(".button-collapse").sideNav();
    var el = document.querySelector('.custom-scrollbar');
    Ps.initialize(el);

from startbootstrap.