Change SfGrid font size

Is there a way to change the font size for the entire SfGrid ? I am using the styles below to change font-size  but I also need for at least the footer too and if possible for the groups, group totals etc.  

 <style>

     .e-grid .e-headercelldiv {

         font-size: 9px;     }

     .e-grid .e-rowcell {

         font-size: 9px;     }

 </style>



1 Reply 1 reply marked as answer

PS Prathap Senthil Syncfusion Team December 12, 2024 03:18 PM UTC

Hi Ben Junior.

We would like to clarify that we have handled different font sizes for groups, group totals, and other elements in the grid. If you need to customize the font size for different scenarios, you can do so using CSS. You have already customized the header cell and row cell. here, we have provided CSS customizations for the group caption name, group totals, pager.Kindly refer to the code snippet and sample below for your reference.

<style>

    .e-grid .e-headercelldiv {

        font-size: 9px;

    }

 

    .e-grid .e-rowcell {

        font-size: 9px;

    }

 

    .e-grid .e-groupcaption {

        font-size:9px;

    }

 

    .e-grid .e-summarycell {

        font-size: 9px;

    }

 

    .e-grid .e-grouptext {

        font-size: 9px;

    }

 

    .e-grid .e-pager div{

        font-size: 9px;

    }

</style>



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

Regards,
Prathap Senthil


Marked as answer
Loader.
Up arrow icon