When you create a new project, you will see a blue frame on your page—it determines the width and height of your desktop layout. By default, the frame width is set to 1024px, but you can customize it and make your layout up to 2880px wide.
To do so, click Widgets in the bottom right corner of your screen and select Grid & Guides. Click on the default value ‘1024’ and enter a new value for your layout width.
To make the blue frame visible again, select Set 1 in the Grid & Guides settings and set the number of columns to zero.
If you want your content to appear seamless on different screen sizes, we recommend enabling Scale Layout before you start building your project. You can find this option in the Viewer tab of your project settings. In this case, you don’t need to set the width of your layout: after publishing, your project will look the same way it appears in the Editor mode. The blue frame won’t be visible in the Editor if Scale Layout is enabled, аs the layout area will be the same as your screen area. But make sure to keep the browser zoom set to 100% when previewing the project, so you can see exactly how the project will look to your visitors.
In Guides, you can switch between three predefined sets. To view them, click on Set 1 in the upper left corner of the Grid & Guides settings.
You can also set your own number of columns and lines, as well as their width and margins. To make columns equal, set width manually. Otherwise, their width is calculated manually, based on a variety of different parameters, which can cause inaccuracy.
In Grid, there are also three default settings that you can alter by entering whatever values you need.
If Snap is activated, a widget aligns automatically to the grid, guides, and nearby widgets when you move it.
Enable Sizes to see the height and width of all your widgets. Learn more about working with widgets here.
Blocks is a beta feature that gives you an opportunity to work separately on different parts of your page. Learn more about it here.