Html 垂直对齐并对齐字体图标旁边的文本

我在我的网站上设置了一个“联系人”部分，但在格式化信息时遇到了困难。我想要的是一个垂直的图标列表，旁边有垂直对齐的文本

对于单行，这意味着文本行应与图标的水平轴对齐

对于多行，第一行文本应与图标的水平轴对齐，后续行应与第一行文本（而不是图标）左对齐。但我不知道如何才能达到这种效果

这就是我到目前为止所做的：

ul{
列表样式：无；
}
p{
显示：内联；
}
a{
字号：28px；
}

我已经修改了JSFIDLE中的代码，以满足您的需求

.fa

和

p

元素现在是

内联块

，具有

垂直对齐

的

中间

此外，如前所述，我在图标中添加了

fa-fw

（字体固定宽度）类

示例如下：

ul{
列表样式：无；
}
法先生，
p{
显示：内联块；
垂直对齐：中间对齐；
}
a{
字号：28px；
}

看来我被揍了一顿。大致相同，只是我删除了

I

并将它们放置在

：在
li
之前。我只是喜欢CSS中的东西，以便在需要时在站点的其他区域进行复制


ul{
列表样式：无；
}
李{
字号：28px；
显示：内联块；
}
地址：前{
字体系列：Fontsome；
内容：'\f0e0'；
右边距：10px；
显示：内联块；
}
电子邮件：以前{
字体系列：Fontsome；
内容：'\f1fa'；
右边距：10px；
}
a{
显示：内联块；
垂直对齐：中间对齐；
}


多行地址第1行
第2行

雅虎网站上的电子邮件
不知道字体中的固定宽度。干杯