# Styling and CSS

Develop powerful and lightweight web applications using ASP.NET MVC controls. Learn more about the ComponentOne MVC controls in ASP.NET MVC documentation.

## Content



CSS classes for the MultiRow control are as follows:

| **Class** | **Description** |
| --- | --- |
| .wj-cell.wj-header | Styles the header cells including column header, row header and top left cell. |
| .wj-multirow .wj-hdr-collapse | Styles the collapse column header icon displayed at the right edge of the last column header cell. |
| .wj-multirow .wj-hdr-collapse:hover | Styles the collapse column header icon when a user hovers the mouse over it. |
| .wj-cell | Styles all the cells in the MultiRow control. |
| .wj-cell.wj-alt | Styles the alternate rows in the MultiRow control. |
| .wj-multirow .wj-cell.wj-record-end:not(.wj-header) | Styles the line between each record. |
| .wj-multirow .wj-cell.wj-group-end | Styles the line between groups. |
| .wj-cell:not(.wj-hasdropdown) | Styles the overflow text in cell |
| **Selection** |  |
| .wj-cells .wj-cell.wj-state-selected | Styles the currently selected cell in the MultiRow control. |
| .wj-cells .wj-cell.wj-state-multi-selected | Styles the currently multiple selected cell in the MultiRow control. |
| .wj-flexgrid .wj-marquee | Styles the Excel-style element that highlights the selection when the **showMarquee** property is set to true. |
| .wj-state-active | Styles the active cell. |
| .wj-cell.wj-header.wj-state-multi-selected | Styles the selected cell headers when the **showSelectedHeaders** or/and **showSelectedHeaders** property is set to true. |
| .wj-flexgrid .wj-colheaders .wj-header.wj-state-multi-selected | Styles the selected column headers when the **showSelectedHeaders** property is set to true. |
| .wj-flexgrid .wj-colheaders .wj-header.wj-state-multi-selected | Styles the selected row headers when the **showSelectedHeaders** property is set to true. |
| **Editing** |  |
| .wj-flexgrid .wj-grid-editor | Styles the cell editor element. |
| .wj-glyph-pencil | Styles the pencil icon displayed in the row header of the currently editing row. |
| .wj-glyph-asterisk | Styles the asterisk icon displayed in the row header of the new row template. |
| **Freezing** |  |  |
| .wj-frozen | Styles non-header frozen cells. |
| .wj-cell.wj-frozen-row | Styles cells in the last frozen row. This style can be used to create a horizontal divider line between the frozen and scrollable rows. |
| .wj-cell.wj-frozen-col | Styles cells in the last frozen column. This style can be used to create a vertical divider line between the frozen and scrollable columns. |
| **Sorting** |  |  |
| .wj-glyph-up | Styles the up-arrow icon displayed in the column header of a column sorted in ascending order. |
| .wj-glyph-down | Styles the down-arrow icon displayed in the column header of a column sorted in descending order. |
| **Grouping** |  |
| .wj-cell.wj-group | Styles the group row. |
| .wj-glyph-down-right | Styles the expand icon displayed in the group row for the expanded group. |
| .wj-glyph-right | Styles the collapse icon displayed in the group row for the collapsed group. |
| .wj-grouppanel | Styles the div host element for GroupPanel control. |
| .wj-grouppanel .wj-groupmarker | Styles the div element for each grouped column displayed in the GroupPanel control. |
| .wj-grouppanel .wj-groupmarker .wj-remove | Styles the (x) mark displayed in the group panel for each column header element. |
| .wj-glyph-drag | Styles the drag icon for each grouped column displayed in the GroupPanel control. |
| **Filtering** |  |
| .wj-glyph-filter | Styles the filter icon displayed in column headers. |
| .wj-filter-on | Styles the filter icon when the column has been filtered. |
| .wj-filter-off | Styles the filter icon when the column has not been filtered. |
| .wj-columnfiltereditor | Styles the div host element for FilerDialog. |
| .wj-valuefilter-editor | Styles the div host element for Value Filter. |
| .wj-conditionfilter-editor | Styles the div host element for Condition Filter. |
| **Filtering** |  |
| .wj-cell.input-validation-error | Styles the cell editor with invalid input value. |
| .wj-cell.wj-state-invalid | Styles the cells with invalid value. |