Font Awesome icons not responding to font-size CSS

1

I have some icons that I want to be larger than 5em, therefore I can’t use the class fa-5x I’m trying to style the icons directly by setting the font size to 8em, which should in theory work, however I’m getting no result.

 i {
   color: white;
   font-size: 8em;
 }

This styles the icons white, but the size is not changed. Where have I gone wrong here?

PS I am able to size the icons by using inline style in the html, but this is not a great solution. I’d like to be able to do it through CSS.

2

This will help. It overrides anything else in the cascade.

 i {
   color: white;
   font-size: 8em !important;
 }
1 Like
3

Thank you kindly sir!

4

This is an old question but the efficient solution is to link your own css file under the font-awesome linked css file inside the head tag. Then your css file will override anything the font-awesome css file.