用css/html创建固定的侧边栏和固定的菜单栏，并带有“浏览器选择的宽度/高度”

Question

我想用bootstrap创建一个固定的侧边栏和固定的菜单栏，以及一个像这个例子一样的内容页面：

​

​

对于菜单栏，我使用以下css (可以工作)

.fixed-top {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 0;
}

但是我应该在侧边栏中使用什么css呢？因为我不知道菜单栏的高度(我不想显式设置它，但让浏览器选择)。如何将侧边栏附加到菜单栏的底部？

.fixed-left {
  position: fixed;
  left: 0;
  z-index: 0;
  .... (how to set it fixed to the bottom of the menubar?)
}

谢谢!

Answer 1

在.fixed-left中修改一些css

.fixed-left {
  position: fixed;
  top: 0; // set it equal as the height of fixed-top 
  bottom: 0; // so that it will stick to bottom
  left: 0;
  z-index: 0;
  overflow-y: auto; // it will have the scroll if it has more content
  width: 250px; // set as per your requirement
}