Bootstrap 3左关闭杆，容器流体高度为100％

Question

我正在尝试为这样的页面创建一个布局，该布局具有全高的左关闭栏。 我一直碰到左关闭栏，要么将所有内容向下推，要么仅限于左上角：

Answer 1

我想你想要这样的东西。

 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> 

Answer 2

如果您想使侧边栏全高，可以使用

.sidebar{
   height:100vh;
}

然后你可以给position:fixed;