Learn how to make your page full width with our full-width layout or the full-width feature on the Container Element.
How to Get Started with the Container Element
Firstly, you will want to drag a Container Element onto your page. From the right-hand menu of the editor, you will notice that there is a "Full Width" toggle. Toggling this will set this Container Element to full width on your page.
Adding a width to full-width content
Some page templates are full-width by default. If you'd like to set a width on content within a full-width area, Columns or the Maximum Width setting can be used. There are a few methods of getting around this to make your content responsive.
Option 1: Using Columns to Center Content
Using Columns is a quick and easy option. Simply add a 3-column element into the page, then place your content in the center column.
The Column Sizes slider can be used to adjust the width of the columns.
โ
Option 2: Using Max Width & Auto Margins to Scale Down and Center Elements
Another option for centering content is to combine the Maximum Width setting with auto Margins.
Select the element you'd like to center. In the Advanced style options, set a Maximum Width to limit its size:
โ
Next, go to the element's Margins options. On the left & right margins, click on the "px" next to the text input and select "auto" from the dropdown. This will center the element.