Bootstrap Jumbotron不調整高度

Question

我在Bootstrap Jumbotron中嵌套了一些輸入，但Jumbotron似乎並沒有增加輸入框的高度。它們似乎在Jumbotron上方流動，而不是在它之內。這是我的虛擬代碼。任何線索爲什麼這不嵌入Jumbotron內？

<div class="jumbotron"> 

      <div class="col-sm-3 col-md-2"> 

       <div class="inputtext"> 
        Current Balance 
        <div class="input-group"> 
         <span class="input-group-addon">$</span> 
         <input type="number" id="currentbalance" class="form-control" placeholder="0"> 
        </div> 
       </div> 

       <div class="inputtext"> 
        Monthly Contributions 
        <div class="input-group"> 
         <span class="input-group-addon">$</span> 
         <input type="number" id="monthlycpontribution" class="form-control" placeholder="0"> 
        </div> 
       </div> 

       <div class="inputtext"> 
        Interest Rate 
        <div class="input-group"> 
         <span class="input-group-addon">%</span> 
         <input type="number" id="interestrate" class="form-control" placeholder="0"> 
        </div> 
       </div> 

       <div class="inputtext"> 
        Years Contributing 
        <div class="input-group"> 
         <span class="input-group-addon">+</span> 
         <input type="number" id="yearscontributing" class="form-control" placeholder="0"> 
        </div> 
       </div> 

       <div class=""> 
        <input class="btn btn-default" type="submit" id="calculate" value="Calculate"> 
       </div> 
      </div> 

      <div class="col-sm-9 col-md-10"> 
       Chart goes here 
      </div> 

</div> <!-- /container --> 

Answer 1

在引導，col-*類需要包含在父<div>一類行。這裏有一個的jsfiddle與包括父<div class="row">：

http://jsfiddle.net/fpcucjed/

現在，場不流血過去的超大屏幕。