为什么我的自举输入不能填满空间？

Question

我有以下HTML：

<div class="schedule landingDetail container"> 
    <div class="form-group"> 
     <div class="col-md-6" style="background: red;"> 
      <input type="text" class="form-control input-sm" placeholder="First Name"> 
     </div> 
     <div class="col-md-6" style="background: green;"> 
      <input type="text" class="form-control input-sm col-md-12" placeholder="Last Name"> 
     </div> 
    </div> 
</div> 

我COL-MD-6似乎一切正常，但我的输入没有填满可用空间。它看起来像这样：

我在做什么错？

Answer 1

默认情况下，Twitter Bootstrap将填充添加到列网格类中，您需要将填充设置为0以覆盖整个宽度。

.schedule .form-group .col-md-6 { 
 
    padding: 0; 
 
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" /> 
 
<div class="schedule landingDetail container"> 
 
    <div class="form-group"> 
 
    <div class="col-md-6" style="background: red;"> 
 
     <input type="text" class="form-control input-sm" placeholder="First Name"> 
 
    </div> 
 
    <div class="col-md-6" style="background: green;"> 
 
     <input type="text" class="form-control input-sm col-md-12" placeholder="Last Name"> 
 
    </div> 
 
    </div> 
 
</div>