引导表单内联缩进

Question

所以我第一次在bootstrap中工作，我正在制作一个表单，比如：

<div class="input-group col-xs-2">
    <label>Voornaam:</label>
    <input type="text" class="form-control" placeholder="Voornaam">
</div>
<div class="input-group col-xs-2">
    <label>Achternaam:</label>
    <input type="text" class="form-control" placeholder="Achternaam">
</div>
<div class="input-group">
     <label for="adresCaptain" class="control-label">Straatnaam + nr:</label>
     <div>
         <div class="form-inline">
             <div class="form-group col-xs-9">
                 <input type="text" class="form-control" id="streetCaptain" placeholder="Straat"/>
             </div>
             <div class="form-group col-xs-3">
                  <input type="number" class="form-control" id="houseNrCaptain" placeholder="Nr"/>
             </div>
         </div>
      </div>
</div>

现在，我遇到了一个"表单内联"部分的缩进问题。由于某些原因，它比表单的其他部分更缩进

结果图像：http://puu.sh/g874J/2579b314e4.png

你知道为什么会出现这种情况，以及我如何使它对表单的每个部分都有相同的缩进吗？

Answer 1

col-xs-X类为div添加了一个额外的填充。