通过可滚动页面固定定位的侧边栏

Question

我有一个侧边栏，如下面的照片所示：enter image description here

我希望边栏可滚动，并且我也希望整个页面都可滚动（因此我可以在主要区域中滚动），但是我希望边栏在滚动整个页面时保持其位置。 我当前的CSS设置是：

#sidebar{ 
position: fixed;
top: $height_ofnav
bottom: 0;
width: $sidebarwidth;
margin-left: $main_areawidth;
overflow-y: scroll;
}

#main_area
{
width: $total_screen-sidebarwidth;
}

但是，当我向下滚动页面时，行为是：

enter image description here

我要实现的行为类似于https://docs.python.org/3.7/

中的侧边栏

我想我丢失了一些东西，即使定位是正确的方法，我也不确定，何时使用浮动而不是固定位置？