我正在尝试使用 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
类给出了 <i/>
元素固定宽度约为 1.3em。但是 fa-3x
类将字体大小设置为 3em。这就是为什么看起来图标被推到了右侧,但实际上容器对于图标来说太小了。
基本上需要的就是自己定制fa-fw-3x
类(class)。像这样:
.fa-fw-3x { width: 3.3em; }
摆弄宽度以找出您需要的。
关于css - fa-border with fa-fw,边界内错误对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34064338/