Add CSS style also to field in Sum row

[ArneMancofi]

Is your feature request related to a problem? Please describe. I have a Sum row, and would like to be able to right align the number fields using CSS.

Describe the solution you'd like Whenever .Css(css) is used, css is added to the field in the Sum row, just like all the other rows.

It might be useful to also add a class tag (e.g., grid-sum) to the Sum row, to be able to distinguish the Sum row from the regular rows.

Describe alternatives you've considered I haven't really been able to figure out an alternative for targeting the field in the Sum row.

Additional context This feature would be useful for all aggregate rows, like Min, Max, Average, etc.

[comichael]

I suggest you play around with the CSS :nth-child() selector, based on the CSS class .grid-total-rows

.grid-totals-row td:nth-child(1){
    color: red;
}

[ArneMancofi]

I suggest you play around with the CSS :nth-child() selector, based on the CSS class .grid-total-rows

.grid-totals-row td:nth-child(1){
    color: red;
}

Ah, good idea! Thanks 👍

[tony-asu]

Would this include conditional css?

I've got 2 issues..

• using the nth-child when the columns can be reordered.
• changing the color of the text when the sum is negative without having a separate row.

For now I'm using javascript to avoid these issues, but it would be nice if I didn't have to

[gustavnavar]

Package 4.0.5 allows to configure css classes for the total rows:

Parameter	Type	Description	Example
GridSumCssClass	string (optional)	Html classes used by the sum row elements (it overrides default parameter)	<GridComponent T="Order" Grid="@_grid" GridSumCssClass="grid-sum-cell" />
GridAverageCssClass	string (optional)	Html classes used by the average row elements (it overrides default parameter)	<GridComponent T="Order" Grid="@_grid" GridAverageCssClass="grid-sum-cell" />
GridMaxCssClass	string (optional)	Html classes used by the max row elements (it overrides default parameter)	<GridComponent T="Order" Grid="@_grid" GridMaxCssClass="grid-sum-cell" />
GridMinCssClass	string (optional)	Html classes used by the min row elements (it overrides default parameter)	<GridComponent T="Order" Grid="@_grid" GridMinCssClass="grid-sum-cell" />
GridCalculationCssClass	string (optional)	Html classes used by the calcultation row elements (it overrides default parameter)	<GridComponent T="Order" Grid="@_grid" GridCalculationCssClass="grid-sum-cell" />