CSS

All columns have CSS classes based on position and their data column's name.
Individual columns can be styled using CSS.

CSS Classes

Name Element Types Description
sortable-table table Root table used for web component.
checkbox-column th, td Column used to display selection checkboxes
column-N th, td (N is an integer) Data columns, in order of display. This is useful when formatting independant of whether a checkbox column is or is not displayed. When a checkbox is not displayed, column-0 will refer to td:nth-of-type(0), but with a checkbox it will be td:nth-of-type(1)
column-NAME th, td (NAME is a column's name) This is what should be used to style column cells. Styles will be fixed to a column even when columns are reordered for display.
grid tbody Added when {{grid}} is true
selected-row tr Added to any row that has been selected (1 or more)
editor-row tr Added to a row that is being edited (at most 1 row)
edited-row tr Added to any row that has been been edited and the change is part of the undo stack. (at most 1; or 1 or more if multiRowEdit is true)
simplePager div Built-in footer template
indexedPager div Built-in footer template
defaultPager div Built-in footer template
articlePager table Built-in footer template
infinitePager div Built-in footer template