How to change the font size, type, bold on a certain column

[Tyrone]

Hi team,

I need to change the font size and size on a certain column. I saw some solution on your forum using css but it affects all the column... is there is a way to set class on a specific column?

Best Regards,

Tyrone

[Monisha Saravanan]

Hi Tyrone,

Greetings from Syncfusion support.

Query: “I need to change the font size and size on a certain column. I saw some solution on your forum using css but it affects all the column... is there is a way to set class on a specific column?”

We have checked your query and we suspect that you need to change the font size for the particular column. If so we suggest you to achieve your requirement by using the CustomAttribute feature of DataGrid. Kindly check the attached code snippet and sample for your reference.

 

<SfGrid DataSource="@Orders" Height="315">

    <GridColumns>

        <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID"  TextAlign="TextAlign.Right" Width="140"></GridColumn>

        <GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer ID" CustomAttributes="@(new Dictionary<string, object>(){ { "class", "e-attr" }})" Width="120"></GridColumn>

        <GridColumn Field=@nameof(Order.ShipCity) HeaderText="Ship City"  Width="100"></GridColumn>

        <GridColumn Field=@nameof(Order.OrderDate) HeaderText="Order Date" Format="d" Type="ColumnType.Date" Width="100"></GridColumn>

    </GridColumns>

</SfGrid>

 

 

<style>

    .e-attr {

        font-size: 20px !important;

     

    }

</style>

 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorApp1796707900.zip

Reference: https://blazor.syncfusion.com/documentation/datagrid/cell#custom-attributes

https://blazor.syncfusion.com/demos/datagrid/cell-formatting?theme=bootstrap4

https://blazor.syncfusion.com/documentation/datagrid/column-template

Please let us know if you have any concerns.

Regards,

Monisha

[Tyrone]

Thanks Monisha, It worked!!

[Monisha Saravanan]

Hi Tyrone,

Most Welcome.

We are glad to hear that the reported query has been resolved. Kindly get back to us if you have further queries. As always we will be happy to assist you.

Regards,

Monisha