如何将我的字体真棒图标与我的文本对齐？答案

【问题标题】：How can I align my font-awesome icons with my text?如何将我的字体真棒图标与我的文本对齐？
【发布时间】：2014-09-03 06:55:45
【问题描述】：

我一直在尝试使用我的 Fontastic.me 图标使我的文本居中。

这是我的代码：

HTML：

<html>
 <div id="info">
    <ul>
        <li id="chat"><span class="icon-comment-discussion"></span><p>We offer the best & simplest chat system on the web.</p></li>
</ul>
</div>
</html>

还有我的 CSS：

#chat {
line-height: 72px;
vertical-align: middle;
}

它根本没有对齐，当我更改垂直对齐选项时没有任何变化。我在想也许是因为我的文字在段落标签中；但我想先在这里问。

已解决：我添加了垂直对齐：中间；到：

#chat span {

}

效果很好。

【问题讨论】：

标签： css icons font-awesome fontastic

【解决方案1】：

作为标准的段落将应用边距，您可以尝试删除边距以查看是否有帮助，或者将图标放在段落内。

p{ margin:0; }

【讨论】：

对不起，我忘了说我已经应用了 reset.css。我尝试了你的想法，但不幸的是它没有奏效。我还尝试将图标放在段落中，但也没有用：/
我相信字体真棒图标都是等距/大小的，因此您应该能够为图标本身的垂直对齐提供固定的像素值。试试这个... .icon-comment-discussion{ vertical-align:-10px; }