引導 - 將側面導航擴展到頁面底部。身高100％

Question

一直試圖天，現在我身邊的導航延伸到頁面的底部，我已經Google'd和到處找。人們不斷地說有高度在HTML和身體100％，並有周圍的最小高度的導航div容器：100％，但是，沒有工作的。

開始認爲這是不可能在Twitter的引導，由於它是浮動的。

我真的不能用絕對的或任何位置，因爲我需要這個來保持充分響應。我在span 2中有一個側面導航，右側是我的內容。

代碼導航：

<div class="span2">     
    <div class="span10 shadow-right fill" style="background-color: #860038; min-height: 100%;  overflow: hidden;"> 

    <ul class="side-nav"> 
     <a href="dashboard/index"><li class="side-box-active">My Dashboard</li></a> 
     <a href="dashboard/control_panel"><li class="side-box">Control Panel</li></a> 
     <a href="dashboard/support"><li class="side-box">Support</li></a> 
    </ul> 

    </div> 
</div> 

我的CSS：

html, body { 
    height: 100%; 
} 

.fill { 
    min-height: 100%; 
    height: 100%; 
} 
    .side-nav { 
     list-style: none; 
     margin: 0 !important; 
    } 

    .side-nav li { 
     margin-top: 20px; 
     padding-top: 16px; 
     margin-bottom: 20px; 
     padding-left: 16px; 
     cursor: pointer; 
     color: #860038; 
    } 

    .side-nav li a{ 
     font-size: 15px; 
    } 

Answer 1

看起來你錯過了你的<div class="span2>的fill類，這是你的資產淨值的父容器。所以它應該是<div class="span2 fill">。另外，我假設你是跨嵌套行和容器內，以及這也將需要被告知延長100％;應該看起來像這樣：

<div class="container fill"> 
    <div class="row fill"> 
    <div class"span2 fill"> 
     <ul class="side-nav fill"> 
     </ul> 
    <div> 
    </div> 
</div>