All Collections
How to make a full width page
How to make a full width page
If you want to make a page full width, use a Container element and toggle the full-width button, or use the landing page style layout.
Written by Edward Savoy
Updated over a week ago

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.

Did this answer your question?