twitter-bootstrap Bootstrap 3 中的 input-group-addon 小于 input-group-sm 选项
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18855617/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
input-group-addon in Bootstrap 3 smaller than input-group-sm option
提问by Nate
In bootstrap 3, I'd like to make an input and input-group-addon that are smaller than the input-group-sm option. I can get my input to 20 px, but unfortunately when I do this I find that the input-group-addon always ends up a pixel or two bigger than the input itself.
在引导程序 3 中，我想制作一个小于 input-group-sm 选项的 input 和 input-group-addon。我可以将输入设置为 20 像素，但不幸的是，当我这样做时，我发现输入组插件总是比输入本身大一两个像素。
Here's a jsfiddle...
这是一个jsfiddle...
http://jsfiddle.net/stazna01/U6MJe/1/
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>
回答by isherwood
Try making the box-sizing properties coordinate:
尝试使 box-sizing 属性协调：
input, span {
box-sizing: content-box;
-moz-box-sizing: content-box;
}
回答by drps
this example is not working for 18px height
此示例不适用于 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/Also, firebug is telling me that actual height of span element in your example is 20.3667px
http://jsfiddle.net/drps/Bxm5x/2/另外，firebug 告诉我你的例子中 span 元素的实际高度是 20.3667px
