In the Generator theme, your page layout follows a clear hierarchy: Sections contain Columns, and Columns contain Modules (like image or text modules). Most styling happens at the section level, but columns have their own settings you'll use regularly — especially for spacing and visibility.
Columns support drag-and-drop width adjustment directly on the canvas. You can grab and reposition columns within a section to rearrange your layout as needed.
To style a column, click its Edit (pencil) icon. The column style panel gives you control over:
Background colors, images, and gradients are available but rarely needed at the column level.
When two columns feel too close together — for example, an image column on the left sitting too tight against a text column on the right — the right fix is to add padding to one of the columns, not margin or module-level spacing.
Add padding right to the image column to push the content away from the adjacent column. Because padding works inside the column's box, it will slightly reduce the rendered size of the image while creating visual breathing room.
Any padding you add on desktop will carry over to mobile by default — and you'll usually want to remove it there. Here's the process:
This lets the image expand to the full content width on mobile, which almost always looks better. Generator keeps desktop and mobile spacing settings fully independent — changes on mobile won't affect desktop, and vice versa.
After building or editing a page, switch to the Mobile editing view and scan for elements that are sitting too close together. Generator is mobile-responsive out of the box, but manual edits can sometimes cause tightness between elements. Use the mobile editor to add padding or margin where needed — those settings will stay mobile-only.