linear-gradient渐变为何有白边？

Question

<style>
.bn{
    color: #FFFFFF !important;
    height: 35px;
    width: 35px;
    line-height: 36px;
    text-align: center;
    border-radius: 35px;
    font-size: 15px;
    margin-left: 20px;
    margin-right: 20px;
    text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
    box-shadow: 0 20px 67px 0 rgba(0, 0, 0, .12), 0 5px 14px 0 rgba(0, 0, 0, .2);

}
</style>
<i class="fas fa-dollar-sign bn" style="linear-gradient(180deg, #e2c6a7 0%, #AA8E69 100%)"></i>

这样就有白边，效果这样的。

下面，右边，都有1像素，白边。

然后我把高度变成36px，宽度变成36px，他就没有白边了。这是咋回事呢，比较奇葩了，高度、宽度是奇数就有白边，偶数没有。

Answer 1

    height: 35px;
    width: 35px;
    line-height: 36px;
    border-radius: 35px;

你这几个数值，把这个line-height: 36px;改成 line-height: 35px;