0

font awesome 4 代码生成了这些 SVG，这些 SVG 不能使用典型的 CSS 进行定位，这很糟糕，并且破坏了我的整个代码库。

过去，你可以制作一个<i>标签，并像其他所有东西一样设置它的样式，但现在这些 SVG 是在 DOM 中生成的，你不能使用text-alignormargin等​​。

我已经尝试将图标包装在 div 中，但这仍然是有限的，并且在 div 内对齐时不会影响图标本身。

所以这：

        <div class="tradeoff-cell">
            <span class="tradeoff-title">Lower Cap</span>
            <div class="tradeoff-icon">
                <i class="fa fa-bar-chart" aria-hidden="true"></i>
            </div>
        </div>

变成这样：

<div class="tradeoff-cell">
    <span class="tradeoff-title">Lower RL Rate</span>
    <div class="tradeoff-icon"><svg class="svg-inline--fa fa-chart-line fa-w-16" aria-hidden="true" data-prefix="fa" data-icon="chart-line" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M500 384c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H12c-6.6 0-12-5.4-12-12V76c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v308h436zM456 96H344c-21.4 0-32.1 25.9-17 41l32.9 32.9-72 72.9-55.6-55.6c-4.7-4.7-12.2-4.7-16.9 0L96.4 305c-4.7 4.6-4.8 12.2-.2 16.9l28.5 29.4c4.7 4.8 12.4 4.9 17.1.1l82.1-82.1 55.5 55.5c4.7 4.7 12.3 4.7 17 0l109.2-109.2L439 249c15.1 15.1 41 4.4 41-17V120c0-13.3-10.7-24-24-24z"></path></svg><!-- <i class="fa fa-line-chart" aria-hidden="true"></i> -->
    </div>
</div>
4

0 回答 0