C20. Column container

14 Jan 2022

Component finalised

@Japneet Kaur (Deactivated) @Steven Mao (Unlicensed)

BR-1

The following columns types are available within the Column Container component:

• 1 column - 100%

• 2 columns - 50% - 50%

• 2 columns - 66% - 33%

• 2 columns - 33% - 66%

• 3 columns - 33% - 33% - 33%

• 4 columns - 25% - 25% - 25% - 25%

BR-2

The content section within each column of the Column Container is an AEM parsys that must populated by other AEM components, e.g. Rich Text, Image, Content Tile.

BR-3

Columns are stacked vertically on mobile which follow mobile responsive design principles.

1

Top border

Checkbox

N

Checkbox to specify whether the container should have a border above the columns

2

Columns

Drop-down

N

Select how many columns should appear without the Column Container, options available:

• 1 column - 100% (default)

• 2 columns - 50%-50%

• 2 columns - 66%-33%

• 2 columns - 33%-66%

• 3 columns - 33%-33%-33%

• 4 columns - 25%-25%-25%-25%