How do I correctly stack fa icons in Angular FontAwesone

Asked Oct 04 '21 at 21:58

Active Oct 05 '21 at 13:33

Viewed 464 times

I’m tryin to stack two fa icons using Angular Fontawesome. So far I have this:

        <fa-stack>
        <fa-icon [icon]="['far', 'circle']" style="font-size: 8px;" stackItemSize="2x"></fa-icon>
        <fa-icon icon="file-alt" style="margin-left: 10px;" stackItemSize="1x"></fa-icon>
    </fa-stack>

This works as I want, but the second icon, the file icon, is not centered inside the circle even with the margin and even using text-align: center. Can anyone help me fix this? I apologize in advanced for any formatting errors since I am posting from my phone due to being unable to login with my fb account on my PC.

edited Oct 05 '21 at 13:33

asked Oct 04 '21 at 21:58

plasmy

Just remove style="margin-left: 10px"? – mrak Oct 04 '21 at 22:02
No. With or without, I’m still having the same issue. – plasmy Oct 04 '21 at 22:03
Please attach a screenshot of how does it look without any extra margins. I have the icon perfectly centered by default using the same code. – Yaroslav Admin Oct 05 '21 at 11:46
I have added a screenshot of how it looks like without the margins. It appears like that with or without the margins. – plasmy Oct 05 '21 at 13:33

How do I correctly stack fa icons in Angular FontAwesone

0 Answers0