css - ブートストラップ - 入力テキスト フィールドとボタンの間のギャップ

Question

これは私のコードhttp://jsbin.com/ixevaw/1/edit

<div class="input-append">
   <input type="search" class="span3" placeholder="Search" name="search" id="search"/>
   <button class="btn">button</button>
</div>

しかし、Safari と IE9 ではテキスト フィールドとボタンの間にギャップがあります。

このギャップを削除するにはどうすればよいですか？

Answer 1

奇妙なことに、タグ間のスペースを削除すると、問題は解決します。したがって、次のようになります。

<div class="input-append">
   <input type="search" class="span3" placeholder="Search" name="search" id="search"/><button class="btn">button</button>
</div>

Answer 2

これは Bootstrap のバグのようです。検出スタイルシートまたは代替スタイルシートのみを使用しているブラウザーでは、おそらくボタンに -5px の左マージンを設定する必要があります。

.input-append input + .btn {margin-left: -5px;}