ASP.NET MVC Controls | ComponentOne
Working with Controls / MultiRow / Work with MultiRow / Styling and CSS
In This Topic
    Styling and CSS
    In This Topic

    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.