如何水平居中字体真棒图标？ [英] How to center Font Awesome icons horizontally?

问题描述

我有一个带有> strong 图标的表格，我想将文本左对齐并居中图标。
我尝试将< i> 居中，但不起作用：

I have a table with a Font Awesome icon and I want to align text left and center icons. I tried with centering <i> but doesn't work:

HTML：

<td><i class="icon-ok"></i></td>

CSS：

td, th {
    text-align: left;
}
td i {
    text-align:center;
}

jsFiddle

jsFiddle

我也尝试设置 text-align： center！important; ，但不起作用。我做错了什么？

I also tried to set text-align:center !important; but doesn't work. What did I do wrong?

推荐答案

添加自己喜欢的字体真棒样式

Add your own flavour of the font awesome style

[class^="icon-"], [class*=" icon-"] {
    display: inline-block;
    width: 100%;
}

其中还有您的

td i {
    text-align:center;
}

应仅将图标居中。

这篇关于如何水平居中字体真棒图标？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！