Bootstrap 3 left close bar 100% height with container-fluid

Bootstrap 3 left close bar 100% height with container-fluid

我正在尝试为这样的页面创建一个布局,其中包含一个全高左侧关闭栏。我将 运行 保留在左侧的关闭栏中,要么将所有内容向下推,要么仅限于左上角:

如果你想让侧边栏全高你可以使用

.sidebar{
   height:100vh;
}

然后你可以给position:fixed;

我想你想要这样的东西。

body {margin:0;}
.side {
  position: fixed;
  background: blue;
  top: 0;
  left: 0;
  bottom: 0;
  width: 100px;
}
.content {
  padding-left: 100px;
  width: 100%;
  height: 100vh;
  box-sizing: border-box;
}
.top {
  height: 100px;
  width: 100%;
  background: orange;
  float: left;
}
.left, .right {
  width: 50%;
  height: 200px;
  float: left;
}
.left {
  background: green;
}
.right {
  background: magenta;
}
<div class="side"></div>
<div class="content">
  <div class="top"></div>
  <div class="left"></div>
  <div class="right"></div>
</div>