Skip to the main content


Tables

Tables are used for displaying information in tabular format, where is useful to be able to examine and compare data or information in columns and rows. edX offers several table styles to provide ways to display most tabular data, including an example that contains the full set of supported semantic elements.

Tables Preview

Basic

First Last Lineage
Aragorn II Elessar Son of Arathorn
Bilbo Baggins Bag End
Meriadoc Brandybuck Buckland
Treebeard Fangorn Fangorn Forest

Simplified and cozy

A tighter table layout.

First Last Lineage
Aragorn II Elessar Son of Arathorn
Bilbo Baggins Bag End
Meriadoc Brandybuck Buckland
Treebeard Fangorn Fangorn Forest

Full Semantic Set

Tables can include a variety of elements that carry semantic meaning; the following example includes a caption, colgroups with highlighted columns, headers for both columns and rows, and a table footer. It also includes some classes for special cases: a wrapper div that allows for scrolling on smaller screens, highlights for columns or cells, and classes for overriding text alignment.

Some fantastical towns and their key characteristics
Town Name Founding feature Weaknesses Strengths Primary Inhabitants No. Inhabitants
Pernrith Ancient water source Low economy Rare animal training and rare herbalism People 15
Fandralore Strong metal ores Armorsmithing Sustainable hunting and prosperous trade Elves 20
Kasmord Precious gems Medicine Strong magicians and refined baking Elves 25
Total World Inhabitants 60

Responsive (with Column hiding)

The example below shows a way to hide non-essential table columns to accommodate small screens.

Town Name Founding feature Weaknesses Strengths Primary Inhabitants No. Inhabitants
Pernrith Ancient water source Low economy Rare animal training and rare herbalism People 15
Fandralore Strong metal ores Armorsmithing Sustainable hunting and prosperous trade Elves 20
Kasmord Precious gems Medicine Strong magicians and refined baking Elves 25

Sortable

First Last Lineage
Aragorn II Elessar Son of Arathorn
Bilbo Baggins Bag End
Meriadoc Brandybuck Buckland
Treebeard Fangorn Fangorn Forest