e-icon disappears when moved to css file

[Luis Roberto]

Hi guys, I am experiencing something strange, I have a Blazor webassembly project, on a page component I have a SfGrid, with a GridCommandColumn, and I use a style to add an icon like this

<style>

        .e-property:before {

            content: '\e405';

        }

</style>

this is the code of my grid

 <GridColumn Width="4" TextAlign="TextAlign.Center">

<GridCommandColumns>

 <GridCommandColumn ButtonOption="@(new CommandButtonOptions() { IconCss="e-icons e-property", CssClass = "e-flat" )"></GridCommandColumn>

 </GridCommandColumns>

 </GridColumn>

It works great, but if I move the style to my app.css file, the icon disappears, I dont know why.

Someone has experienced something similar?

Thanks

[Luis Roberto]

I found that the problem is related to that I added a css file called  fabric-custom.css to replace some of the styles of my template, which in this case is fabric, if I remove that file, the icon is shown.

On that css file I add some styles like this one

.e-grid .e-headercell {

    background: linear-gradient(180deg, #e57a2d 14%, #fca76b 100%);

    font-size: 1.5rem;

    font-weight: bold;

    color: white;

}

So I tried to add the icon there, but it is still not working 

I add it like this

.e-property:before {

            content: '\e405';

        }

This is the order of my css file on index.html on www

    <link rel='nofollow' href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />

    <link rel='nofollow' href="ImpulsaNet.Client.styles.css" rel="stylesheet" />

    <link rel='nofollow' href="css/app.css" rel="stylesheet" />

    <link rel='nofollow' href="_content/Syncfusion.Blazor/styles/fabric.css" rel="stylesheet" />

    <link rel='nofollow' href="css/fabric-custom.css" rel="stylesheet" />

[Luis Roberto]

I found the solution, I add the icon  on my fabric-custom.file this way and it worked great:

.e-grid .e-property:before {

    content: '\e405';

}

[Vignesh Natarajan]

Hi Luis,  

Thanks for contacting Syncfusion support.  

We are glad to hear that you have resolved your query on your own.  

Kindly get back to us if you have further queries.  

Regards, 

Vignesh Natarajan