我如何确保每个字形具有相同的宽度?

我注意到,即使在相同的字体大小,没有一个标准的宽度。 我怎样才能使用这些项目列表的前面,这样的话不会出现锯齿?

问题的屏幕截图:

这是代码:

<ul id="myTab"> <li class="active"><a href="#home"><i class="icon-tasks"></i> Proposal</a></li> <li><a href="#video"><i class="icon-film"></i> Videos</a></li> <li><a href="#asset"><i class="icon-paper-clip"></i> Assets</a></li> <li><a href="#payment"><i class="icon-credit-card"></i> Payment</a></li> <li><a href="#history"><i class="icon-calendar empty"></i> History</a></li> </ul> 

从3.1.1开始,您可以使用icon-fixed-width类而不必编辑CSS。

http://fortawesome.github.io/Font-Awesome/3.2.1/examples/#navigation

从4.0开始,你应该使用fa-fw

http://fortawesome.github.io/Font-Awesome/examples/#fixed-width

感谢@kalessin指出。

你确定你还没有定义另一种风格吗?

这是如何将您的HTML看起来放置到我使用Font Awesome的网站上的文件中:

注意图标和文本是如何排列的。 这是添加了行的原始图像:

它看起来像你有一个定义的样式是删除Font Awesome样式。

您也可以尝试添加原始Font Awesome样式(来自font-awesome.css ),以查看是否可以暂时解决:

 li [class^="icon-"], .nav li [class^="icon-"], li [class*=" icon-"], .nav li [class*=" icon-"] { display: inline-block; width: 1.25em; text-align: center; }