New to Kendo UI for Angular? Start a free 30-day trial
Styling the Header of the Grid when the Filter Menu is Active
Environment
| Product | Progress® Kendo UI® for Angular Grid |
Description
How can I style the header of the Kendo UI for Angular Grid component when the Filter Menu is active?
Solution
To modify the styles of the Grid header when the Filter Menu is active, you can use CSS nesting to target the .k-active class. The class is added to the Filter Menu when the filtering is applied by the user or programmatically.
css
.k-header:has(.k-active) {
background-color: #fbeaeb;
.k-column-title {
color: #2f3c7e;
}
}The following example demonstrates how to style the header of the Grid when the Filter Menu is active.
Change Theme
Theme
Loading ...