Font Awesome CSS overriding my CSS

css, font-awesome, fonts, html

Solution

Make your selector more specific :

.side-icon.fa

See here how the priorities of the selectors are calculated.

Problem

I am working on a page - click here for link. The icons are all supposed to have the font size of .side-icon: ``` .side-icon{ font-size:28px; } ``` BUT a style in font-awesome.css is overriding this, no matter where I include the library in the layout. At the moment I have included the css in the top of a work around sheet (font-awesome-fix.css) using an @import, but I cannot get the 'font: normal normal normal 14px/1 FontAwesome;' to disappear at all. Please help!

Original source