使用CSS更改字体Awesome图标不起作用

Question

we want to modify an Awesome Font icon in our WordPress theme for the whole web. The theme is built with a framework (bebel) and we do not know how to modify the HTML to change the class in the code, because in addition it uses VisualComposer for custom boxes.

Then we want to change the icon by css, I'm going to an option to add extra css of my theme and I put the following rule:

CSS input:

.fa-location-arrow::before {
    font-family: FontAwesome;
    content: "\f041" !important;
}

The changes do not apply, pulse F12 in chrome and inspect the icon. The CSS rule looks like this.

CSS Output:

.fa-location-arrow::before {
     Font-family: FontAwesome;
     Content: \"\\f041\" !important;
 }

CSS Output image:

Is it possible that when saving the css, the topic is processed in php in some special way? Who knows why this happens

Thank you!

Answer 1

I just solved it. I have removed the css from the "Global CSS" option that includes the theme and I pasted the same code into the "style.css" file of the WordPress child theme. Now it works perfectly although I still do not understand why it did not work before. I suspect it will be some way to write to the css through php.

Thank you all!