如何使用大字体 - 真棒图标垂直居中文字？

Question

如何使用大字体 - 真棒图标垂直居中文字？可以说我有一个带有字体真棒图标和一些文字的引导按钮：<div>     <i class='icon icon-2x icon-camera'></i>     hello world</div>如何使文本垂直居中显示？文本现在与图标的下边缘对齐：http：//jsfiddle.net/V7DLm/1/

Answer 1

我99％的时间都在文本旁边使用图标，所以我在全局范围内进行了更改：

.fa-2x {
  vertical-align: middle;}

根据需要将3x，4x等添加到相同的定义中。

Answer 2

在考虑了所有建议的选项后，最干净的解决方案似乎是设置行高和垂直对齐所有内容：

参见Jsfiddle演示

CSS：

div {
    border: 1px solid #ccc;
    display: inline-block;
    height: 50px;
    margin: 60px;
    padding: 10px;}#text, #ico {
    line-height: 50px;}#ico {
    vertical-align: middle;}