The basic data table can be implemented by adding two classes to the table
tag: .small
and .data-table
. A third tag that might be useful is .no-stripe
to remove the zebra striping.
Alternativley to adding .data-table
there are a range of utility classes that can be used to assemble the desired look and feel:
.small
to the table tag, or any tr or td..width-auto
to the table tag..align-top
to the table tag or a td..no-stripe
to the table tag..padding-none
.padding-small
..stretch
to the image.Consider this sample table from ChEMBL which we have done with table.small.data-table.no-stripe
:
For further discussion on data table styling, see this issue.