Table cells may contain many different types of content:
-
Simple unstyled text strings
-
Numeric values, formatted according to the rules of alignment described below
-
Icons, including actionable ones
-
Dynamic data values
-
Live data visualization, e.g. sparkline graphs, etc.
-
Interactions, in-table actions
-
Form elements
-
Buttons
To help with the formatting of these, we should be able to apply existing utilities, e.g. padding overlap. Technically, this probably involves the ability to supply classes to individual cells.
Aligning table cell contents
Table headers match the alignment of data:
- Align text to the left
- Align numbers to the right, provided the data has a consistent number of decimal places. Otherwise, align to the decimal point.
- E.g Dollars and Cents etc should always align
- Fractional and non fractional mixed together can be tricky
- Memory and disk sizes need special rules: probably we need separate guidance, e.g 3.000 TB looks strange, you would want to show 3 TB