角字形图标的背景色不剥落。

Question

我正在使用angular-fontawesome，想要改变字体的背景色--超赞的fa-icon

 <fa-icon 
    class="vue-icon"
    [icon]="faVue"
    ></fa-icon>

我使用class属性更改了颜色。

.vue-icon {
    padding: 10px;
    background: #62dda4;
}

如果我使用size属性使图标更大，bg只填充一半。

 <fa-icon 
    class="vue-icon"
    [icon]="faVue" 
    size="6x"
    ></fa-icon>

​

​

是什么导致了这种行为？

到目前为止，我还没有从库中找到背景属性。

Answer 1

尝试给它一个块属性来包含它。

.vue-icon {
  display: inline-block; /* add this line*/
  padding: 10px;
  background: #62dda4;
}