如何使侧边栏高度取决于内容高度？

Question

我有一个任务是建立一个侧边栏，其高度等于内容。 内容越多，侧栏越大。

实际上，我的侧边栏等于窗口大小，而不是内容。如果我向下滚动页面，则没有侧边栏。

那是我的代码：

HTML：

<div class = "container" style = "height :100%">
  <div class = "row" style = "height:100%">
    <div class = "col-md-3 hidden-xs hidden-sm" style = "height:100%">
      <div class = "sidebar">
       .........
     </div>
   </div>
 </div>
</div>

CSS：

html .sidebar,
body .sidebar {
  height: 100%;
  width: 100%;
  background: black;
}

为什么呢？该怎么做才能使它发挥作用？

Answer 1

如果我理解你的意思，那么你想要修复侧边栏吗？

为了做到这一点，你可以在css中做一些类似的事情。

.sidebar {
  width: 250px;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background: black;
}

<div class="sidebar">

</div>