如何使邊欄高度取決於內容高度？

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>