假设我有一个bootstrap按钮，它有一个字体很棒的图标和一些文本：
<div>
<i class='icon icon-2x icon-camera'></i>
hello world
</div>
如何使文本显示为垂直居中？文本现在与图标的底部边缘对齐:http://jsfidle.net/v7dlm/1/
编辑：我有一个可能的解决方案:http://jsfidle.net/cldeg/1/但感觉有点怪--引入额外的p标记，使用拉左和display：table。也许有人可以建议一个更简单的方法。
我只能自己做，你也得反过来做。
<div>
<span class="icon icon-2x icon-camera" style=" vertical-align: middle;"></span>
<span class="my-text">hello world</span>
</div>
当然，您不能使用内联样式并用自己的css类来针对它。但这是以复制粘贴的方式工作的。
请参阅此处：按钮中文本和图标的垂直对齐方式
但是，如果由我来决定，我不会使用ICON-2X。并简单地指定font-size，如下所示
<div class='my-fancy-container'>
<span class='my-icon icon-file-text'></span>
<span class='my-text'>Hello World</span>
</div>
.my-icon {
vertical-align: middle;
font-size: 40px;
}
.my-text {
font-family: "Courier-new";
}
.my-fancy-container {
border: 1px solid #ccc;
border-radius: 6px;
display: inline-block;
margin: 60px;
padding: 10px;
}
有关工作示例，请参阅JsFiddle
