We use cookies to offer you a better browsing experience, analyse traffic and personalise content. Read how we use your data in our privacy policy.

Table

A stack to manually create a table

Features

  • Easily create a table with header, footer and data cells
  • Elements can be re-arranged by drag-and-drop
  • Global and cell-specific styling
  • Narrow table to save space

  • Standard and custom colors
  • Individual alignment for header-, footer- and data-cells
  • Individual font and style settings

Example

Pos Team Pld W D L GF GA GD Pts Qualification or Relegation
1 Leicester City 38 23 12 3 68 36 +32 81 Qualification for the Champoins League
2 Arsenal 38 20 11 7 65 36 +29 71 Qualification for the Champoins League
3 Tottenham Hotspur 38 19 13 6 69 35 +34 70 Qualification for the Champoins League
4 Manchester City 38 19 9 10 71 41 +30 66 Qualification for the Champions League play-off round
Pos Team Pld W D L GF GA GD Pts Qualification or Relegation

Table Settings

Edit Mode

  • Collapse Table Display - reduces the cells to a single line to save space
  • Display Cells Inline - displays cells horizontally instead of vertically

Setup

  • With Header - creates a table with header line
  • With Footer - creates a table with footer line

General

  • Alignment - select the alignment of the entire table. Does not influence cell alignment
  • Row Select Color - choose the text and background color for selected rows
  • Bodered - draws a border around the table
  • Striped - rows are displayed striped alternately
  • Narrow - makes the cells narrower
  • Hoverable - adds a hover effect to each row
  • Fullwidth - creates a full-width table

Header & Footer

  • Alignment - select the header/footer alignment
  • Custom Color - opens the color selectors
  • Colors - provides two color selectors, text and background

Header- and Footer-Cells (Child-Stacks)

Layout

Span - determines how many columns this cell should span

Alignment

Alignment - select the alignment of the contents of this particular cell

Color

In addition to the standard colors, you can custom colorise your header-/footer-cell individually. Opacity is supported.

Extra

Font Set, Style Set and Cust. CSS Class - open up the advanced features of the Font and Style stacks.

Table Row (Child-Stack)

Colors

Selected - Indicates the particular row to be selected with color settings defined here (Row Select Color).

Extra

Font Set, Style Set and Cust. CSS Class - open up the advanced features of the Font and Style stacks.

Table Row Cell (Child-Stack)

Mode

Header Cell - applies the Header style to the cell. Use this to create a vertical header at the beginning or at the end of a row

Layout

Span - determines how many columns this cell should span

Alignment

Alignment - select the alignment of the contents of this particular cell

Color

In addition to the standard colors, you can custom colorise your header-/footer-cell individually. Opacity is supported.

Link

Add Link - add a link to the table cell. The entire content of the cell will be linked

Extra

Font Set, Style Set and Cust. CSS Class - open up the advanced features of the Font and Style stacks.