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/

现在，场不流血过去的超大屏幕。