カスタマイズされたフォントサイズと入力グループを持つブートストラップ

Question

hereのように、フォントサイズ13px、行の高さ1.538461538（20/13）のカスタマイズされたブートストラップを使用しています。

input-group-btnを使用してinput-groupを使用している場合、要素は、hereのように整列されません。

13pxのfont-sizeで動作し、コンポーネントの整列を保つためにブートストラップを設定する方法はありますか？入力基を有する成分の基本的なコードは次のとおり

<div class="container-fluid"> 
    <div class="row"> 
    <div class="col-xs-4 form-group"> 
     <label>Foo</label> 
     <div class="input-group"> 
     <input type="text" class="form-control" value="" /> 
     <div class="input-group-btn"> 
      <button type="button" class="btn btn-default">Go!</button> 
     </div> 
     </div> 
    </div> 
    </div> 
</div> 

Answer 1

使用する「高さ：100％」

.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child>.btn, .input-group-btn:first-child>.btn-group>.btn, .input-group-btn:first-child>.dropdown-toggle, .input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle), .input-group-btn:last-child>.btn-group:not(:last-child)>.btn 

ラッパークラス「入力グループ」は高さ34画素を有するこのCSSセクションの。だからあなたのすべての入力が完璧に整列するようにそのサイズを持つ必要があります。

Answer 2

解決方法は、フォントサイズ（13px）を掛けたときに、行の高さの係数を目標サイズ（20px）よりも大きな値で調整することです。私の場合、1.538461538は1.538461539でなければなりません。