Skip to main content

Tables

Available on
Faculty Sites
Sites+

HTML tables are used to arrange data that is best understood arranged in corresponding rows and columns.

Accessibility best practice: Tables should not be used for making page layouts because assistive technology relies on tables for communicating information relationships to non-visual users.

Create a table

Begin creating a table by clicking the table icon in the editor toolbar.

The table icon is the first icon in the toolbar

This will open a table properties box where you can choose some initial settings

  • Rows and columns. Choose how many rows and columns to start with. You can always add more later.
  • Headers. Headers are important for understanding certain data.
  • Caption. You have the option to add a table caption.

The table properties box

An empty table will appear in the text editor ready for content.

Edit a table properties

Right-click anywhere in the table at any time to add or remove rows and columns, change the headers, and split and merge cells.

The expanded table properties menu

Table styles

By default, published tables will be plain. Place the cursor anywhere in the table to activate the Styles dropdown and choose between a Basic Table (with some basic borders and header styles) or Striped Table (with alternately shaded rows).

When the table is selected, you can open the Styles dropdown

Example of a striped table

A striped table has alternately shaded rows.

Responsive Tables

Tables will automatically adjust to work well on any width screens. Most tables will rearrange into a single column. Tables with merged or split cells will be horizontally scrollable.

Mockup of a table on a desktop and how the table moves to a single column on mobile