fa-border with fa-fw，边界内错误对齐
fa-border with fa-fw, wrong alignment inside border
我正在尝试使用 fa-fw 和 fa-border 创建一些图标，以使它们具有相同的宽度和边框。我曾尝试使用 fa-stack，但这不再是一个选项。
仅使用fa-border时，里面的图标位于边框的中心，但使用fa-fw会使图标对齐到边框的右侧，至少在某些图标上是这样, 喜欢这个
<i class="fa fa-quote-left fa-fw fa-3x fa-border"></i>
如何使用 fa-fw 和 fa-border
让图标位于边框的中央
如果您查看 css，fa-fw class 为 <i/> 元素提供了大约 1.3em 的固定宽度。但是 fa-3x class 将字体大小设置为 3em。这就是为什么它看起来图标被推到了右侧，但实际上容器对于图标来说太小了。
基本上你需要的是你自己的习惯fa-fw-3xclass。像这样：
.fa-fw-3x { width: 3.3em; }
Fiddle绕着宽度找你需要的。
我正在尝试使用 fa-fw 和 fa-border 创建一些图标，以使它们具有相同的宽度和边框。我曾尝试使用 fa-stack，但这不再是一个选项。
仅使用fa-border时，里面的图标位于边框的中心，但使用fa-fw会使图标对齐到边框的右侧，至少在某些图标上是这样, 喜欢这个
<i class="fa fa-quote-left fa-fw fa-3x fa-border"></i>
如何使用 fa-fw 和 fa-border
如果您查看 css，fa-fw class 为 <i/> 元素提供了大约 1.3em 的固定宽度。但是 fa-3x class 将字体大小设置为 3em。这就是为什么它看起来图标被推到了右侧，但实际上容器对于图标来说太小了。
基本上你需要的是你自己的习惯fa-fw-3xclass。像这样：
.fa-fw-3x { width: 3.3em; }
Fiddle绕着宽度找你需要的。