Generic table component.


Name Length (m) Weight (kg)
John Doe 1.72 68
John Doe 1.72 68
John Doe 1.72 68


About the wrapping div
the additional div wrapping the table in the below implementation is required if you want the table to horizontal scroll on smaller screens. The table needs to be the :only-child of this div.

Custom properties

There are several custom properties available that can be overwritten to control the looks of the table. You can change these properties on the table selector.

Custom property Description
--table-radius Sets the radius of the corners
--table-color Sets the color of the borders and header