twitter-bootstrap - Bootstrap 3，如何减少输入元素中文本的填充？

Question

我将 Bootstrap 3 样式应用于我的编辑表单。但是，我想减少输入框的填充和字体大小。

因此，它使我的编辑表单更大。
我试图更改网格列类(col-sm-，col-md-)，但没有帮助。

并覆盖 CSS ，它使输入框不显示文本。

.form-horizontal .form-group input, 
.form-horizontal .form-group select,
.form-horizontal .form-group label { 
    height: 14px;
    line-height: 14px;
}

HTML:

<div class="form-group">
    <label for="txtProductName" class="col-sm-2 control-label">Name :</label>
    <div class="col-md-3">
        <input type="text" id="txtProductName" CssClass="form-control"/>
     </div>
</div>

Answer 1

总的来说，我不建议在 Bootstrap 中覆盖响应式网格，因为这是使用它的主要原因!

要覆盖表单样式，只需使用下面的代码。

HTML

<div class="form-group">
    <label for="txtProductName" class="col-sm-2 control-label">Name :</label>
    <div class="col-md-3">
        <input type="text" id="txtProductName" Class="form-control form-fixer"/>
    </div>
</div>

CSS

input.form-fixer {
    padding: 1px;
    font-size: 19px;
}

.form-horizontal .form-group input, 
.form-horizontal .form-group select,
.form-horizontal .form-group label
 { 
    height: 14px;
    line-height: 14px;
}

还有一个 Jsfiddle 设置....
http://jsfiddle.net/ZRosenbauer/4wDKp/