I have a sidebar with fixed positioning that contains a list of links:
<nav id="fixedNav">
<div class="anchors">
<ul>
<li><a href="#">test 1</a></li>
<li><a href="#">test 2</a></li>
<li><a href="#">test 3</a></li>
<li><a href="#">test 4</a></li>
<li><a href="#">test 5</a></li>
<li><a href="#">test 6</a></li>
<li><a href="#">test 7</a></li>
<li><a href="#">test 8</a></li>
<li><a href="#">test 9</a></li>
</ul>
</div>
<div class="button"></div>
</nav>
#fixedNav {
position: fixed;
left: 0;
top: 70%;
z-index: 1000;
}
#fixedNav div {
float: left;
}
#fixedNav .anchors {
padding: 1em 1em;
border: 1px solid #ddd;
border-left: 0;
overflow-y: scroll;
}
#fixedNav .button {
width: 50px;
height: 50px;
border: 1px solid #ddd;
border-left: 0;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
You can view the code in action at https://jsfiddle.net/850bfnb1/
My issue is that I want to add a scrollbar to the sidebar because not all the links are visible due to its fixed position, but for some reason the scrollbar appears but does not work properly. Any ideas on how to fix this?