Notes

Normal Table

Note: Cells padded by default

Column 1 Header Column 2 Header Column 3 Header
Row 1 Column 1 Row 1 Column 2 Row 1 Column 3
Row 2 Column 1 Row 2 Column 2 Row 2 Column 3

Condensed Table

Note: condensed tables don't have padding

Column 1 Header Column 2 Header Column 3 Header
Row 1 Column 1 Row 1 Column 2 Row 1 Column 3
Row 2 Column 1 Row 2 Column 2 Row 2 Column 3

Complex Table

Note: Tables can be used to present lots of data. Including forms and lists

Column 1 Header Column 2 Header Column 3 Header Actions
Row heights scale depending on the size of the tallest cell. The taller the cell, the taller the row. Row 1 Column 2 Row 1 Column 3
Content is pulled left by default. Use following classes to override. rf-table__col--centered rf-table__col--right
By default content is centered vertically. This can be changed to pull content to the top of the cells. This is useful when one cell is much taller than all the others, such as nested tables. rf-table__row--aligntop Content now at top of cell