Learn how to make your pages look great on both desktop and mobile with a great responsive design.

Centering Content with Columns

Use the Column Element to center and align elements horizontally. This will ensure that your content will look great on mobile.

We recommend that you do not use more than 25px of Margins or Padding on left and right sides of an element. Consider using percentages for side margins & padding. (Click on the "px" next to those fields to select "%")

Making Use of Screen Settings

Screen Settings allow you to create unique viewing experiences depending on the device that your user is viewing your site on. You can design for widescreen, desktop, tablet and phone. This can help you design for mobile users, as well as desktop users.

Use the device toggles at the top of the editor to preview different screen sizes as you're building each element or section. Don't wait until the you're nearly finished your page.

Ensure Your Images are Responsive

When using background images on your page, it's worth noting that if you go down in screen size, your image may be cropped.

If you require the full image to be shown, consider using the Image Element instead.

Did this answer your question?