Twitter Bootstrapを使用して入力間のスペースを減らすにはどうすればよいですか？

Question

私は使用しています CSSは、Twitter Bootstrapからスタイルを形成します ただし、フォーム入力フィールド間のデフォルトの間隔を減らしたいと思います。どのCSS要素が上書きする必要があるかはわかりません。

何か案は？

Answer 1

デフォルトのセットアップで作業している場合は、 .line あなたの目標を達成するためのマージン。これを試して：

form .line {
    margin-bottom: 5px; //adjust to your liking
}

もちろん、これは、ブートストラップが使用するラインdivで区切られた入力フィールドを使用して作業している場合です。

<div class="line">
        <label for="input">Full Name</label>
        <div class="input">
            <input type="text" name="input" size="30">
        </div>
</div>
<div class="line">
        <label for="input">Last Name</label>
        <div class="input">
            <input type="text" name="input" size="30">
        </div>
</div>
...

デモ http://jsfiddle.net/andresilich/qxmvd/1/

Answer 2

Bootstrap v2.1を使用する場合、その水平フォームを使用してフォームの高さを減らします。次に、.Control-Groupの底部のマージンを変更すると、目的の効果が得られることがわかります。

デフォルトは20pxです私は信じています、私は8pxを使用します

.form-horizontal .control-group {
    margin-bottom: 8px;
}