Hide sortnumber span element

[Niklas Mühlehner]

In my page I have a SfGrid that allows sorting and has GridsortSettings set so 4 out of 5 columns are sortable.
Now I want to hide the sortnumber, since it does not provide relevant information and is not needed.
To do so, I tried to set display for the element to none directly in the razor file the grid control is in:

.e-grid .e-sortnumber {
    display: none;
}

Somehow this css selector fails to target the element, and the span is still visible.I also tried, ordering the links in _Host.cshtml so the Syncfusion bootstrap file is loaded after my applications css.

[Prathap Senthil]

Hi Niklas Mühlehner,

Based on your requirements, we suggest using the following CSS customization to achieve your goal. Please refer to the code snippet and sample below for your reference.

<style>

    .e-grid .e-gridheader .e-headercell .e-sortnumber {

       display:none;                                                                                    

    }

 

</style>

Sample: https://blazorplayground.syncfusion.com/embed/rNVfZbNvBLaJTONc?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5

Regards,
Prathap Senthil