Container Maxi block

Containers in MaxiBlocks are essential for creating page sections and customising your website layout. They are designed to house rows, columns, and blocks, and you can even nest additional containers inside each other, making it easy to build any page structure you desire.

To add a container, simply click the "Add Block" button and select the Container Maxi block. You'll then be prompted to choose the column layout you want for the row.

Rows

By default, each container has at least one row. You can have multiple rows with different column layouts within the same container, giving you complete creative freedom to customise your website layout.

And if you change your mind about the column structure later, no worries! You can always go back and modify the row settings to choose a different column layout.

How to use the MaxiBlocks container for responsive web design.

Add a container

Select the columns

Toggle open the column picker settings

Set it to 11 and click apply setting

Enable repeater - this will allow all the columns to get the same styles

Select the column

Toggle open the column settings and set the column size to 50%

Add another row

Select 2 columns

In the first column add a text block and an image in the second column

Add your text and images to each block

To make all the images the same size. >> Select the image. >> Toggle open the dimension tab and select 3:2 image ratio

Select the container >> Select background layers >> Give it a colour

Select the base column

Toggle open the settings >> Select background layers >> Give it a colour

Select the top column

Set the padding to 35px

Adjust the dimensions to better fit. >> Select the image. >> Toggle open the dimension tab and select 1:1 image ratio

Toggle >> Advanced tab >> Flexbox