在bootstrap 3中,我想创建一个小于input-group-sm选项的输入和输入组插件。我可以将输入设置为20 px,但不幸的是,当我这样做时,我发现input-group-addon总是比输入本身大一个或两个像素。
这里是一个小伙伴......
http://jsfiddle.net/stazna01/U6MJe/1/
<div
class="input-group input-group-sm input"
style="width: 200px; height: 20px; margin: 100px auto;">
<input type="text"
class="form-control"
placeholder="Search"
style="height: 20px; padding: 0; margin: 0;" />
<span
class="input-group-addon"
style="height: 20px; padding: 0 4px; margin: 0;">
<span class="glyphicon glyphicon-search"></span>
</span>
</div>
答案 0 :(得分:1)
尝试设置框大小属性坐标:
input, span {
box-sizing: content-box;
-moz-box-sizing: content-box;
}
答案 1 :(得分:0)
此示例不适用于18px高度
<div class="input-group input-group-sm input" style="width: 200px; height: 18px; margin: 100px auto;">
<input type="text" class="form-control" placeholder="Search" style="height: 18px; padding: 0; margin: 0;" />
<span class="input-group-addon" style="height: 18px; padding: 0 4px; margin: 0;">
<span class="glyphicon glyphicon-search"></span>
</span>
http://jsfiddle.net/drps/Bxm5x/2/ 另外,firebug告诉我你的例子中span元素的实际高度是20.3667px