css - form-searchとinput-appendを使用して検索フォームを作成すると、検索ボタンが短く表示されます

Question

以下にフィドルとコードを示します。

<form class="form-search">
    <div class="input-append">
        <input type="text" id="search-query" class="search-query" />
        <input type="button" id="search-submit" value="Find" class="btn" />
    </div>
</form>

ボタンはIEまたはChromeで正常に表示されますが、FF（少なくともバージョン15）で表示すると、ボタンは少し短く表示されます。ブートストラップを正しく使用していませんか？

Answer 1

ドキュメントから、使用buttonしている場所を使用する必要がありますinput:

<form class="form-search">
    <div class="input-append">
        <input type="text" id="search-query" class="search-query" />
        <button type="button" id="search-submit" class="btn" >Find</button>
    </div>
</form>

http://jsfiddle.net/tk8Dc/7/

Answer 2

height: auto;入力テキストエリアに追加

入力で使用する別の良い特性 (もう 1 つのヒント) は次のとおりです。

box-sizing: border-box;
-webkitbox-sizing: border-box;
-moz-box-sizing: border-box;