LAYOUT CONTAINER COMPONENT

Usage

The layout container allows you to position components across the webpage.

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.

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.

Layout container with different background colors

Blue

Black

Blue-green

Dark grey

Green

Pink

Very light grey

Yellow