Layout container component
Usage
The layout container allows you to position components across the webpage.
References
Examples
The workspace of each page consists of 12 columns in which components can be placed. You can configure the width of each component, with a minimum of 1 column and a maximum of 12 columns.
TIP: It is possible to configure the responsive behavior of the layout container and other components in the "Layout" tab. Try visiting this page on another device or simply make your browser window smaller. As you can see, the components shift depending on the size of the browser window to optimize the ease of use.
Position components with padding
Layout containers are a great way to provide padding for your components. You can position them above, below and alongside each other to create the webpage you desire.
Title
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.
Padding options
No padding
Default
Large
Layout container with different background colours
Primary
Telenet Yellow
Lemon
White
Dark Brown
Secondary
Bright Blue
Lila
Red
Watermelon
Jeans Blue
Turquoise
Olivine
Tertiary
Golden
Tan
Peach
Sinbad
Sprout
Dust Storm
Shades of brown
Shade 04
Shade 08
Shade 64
Entertainment
Streamz Black Blue
Streamz Black Blue Elevated
Play Sports Grey
Play Sports Soft Grey
Play More Midnight Blue
Play More Grey Blue
