Three column stages

All good content columns come in threes!

Info

What is it about?
A three-column stage on a website refers to the layout where the content is arranged in three parallel columns. This layout offers specific benefits that can be useful depending on the goals and requirements of a website: from more information space to improved organisation.

Good to know

Good to know
The three-column stage is responsive, i.e. on smaller screens the columns are arranged one below the other to ensure a good presentation of the content. When using a three-column stage, it is important that the content remains clear and user-friendly. 

Example A

Spacing between columns

© Urheberrecht sunt et officia ipsum Lorem fugiat.

Dreispaltige Bühne

with extra space between the texts

  • Here are a few facts

  • for a checklist

  • in the centre column

Right hand column with video

Example B

Spacing before and after column content

© Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Middle Column

A triple spacing was entered before the text, while no spacing was entered after the text.

Left Column

A double spacing was entered before the text, while no spacing was entered after the text.

Example C

Different content alignment

Columns with double spacing

The content of this first column is aligned to the left (stage & content element heading)

© Bork Bork Aliter homines

Middle Column

The content of the centre column is displayed in the middle (stage & content element heading)

© Urheberrecht sunt et officia ipsum Lorem fugiat.

Right Column

In the third column, the complete content is displayed aligned on the right (stage & content element heading)

Individual media elements in each column

Example D

© Urheberrecht für die Ausgabe
00:00
© Hier steht das copyright