{{#markdown}} 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: - Smaller text: add a .small to the table tag, or any tr or td. - Disable tables from going 100% wide: add a .width-auto to the table tag. - Align text to top: add .align-top to the table tag or a td. - Remove striping: add .no-stripe to the table tag. - Change padding: add either of these classes to the table tage or td, .padding-none .padding-small. - Allow images to be stretched out of proportion: add .stretch to the image. Consider this sample table from ChEMBL which we have done with `table.small.data-table.no-stripe`:
{{> tables-data}}
For further discussion on data table styling, see this issue. {{/markdown}}