Contents

Horizontal Alignment

Where the columns sit across the row, and how any leftover space between them is shared out.

Where to find it
Labelled Horizontal Alignment in the "Entire Row" section of the Modify drawer.
Per device
Yes — you can set one value for every screen, or separate values for phone, tablet, and desktop.
Underlying CSS
justifyContent

In plain English

When the columns in a row do not fill the whole width, there is space left over. Horizontal Alignment decides what happens to it.

New edits are stored per device on the row. Older widgets that only have the classic row field still render and still show that value in the drawer until you change them.

What each option does

OptionWhat you will see
flex-startAll columns pushed to the left, spare space on the right.
centerAll columns grouped in the middle, spare space split evenly at both ends. The usual way to centre a column.
flex-endAll columns pushed to the right, spare space on the left.
space-betweenFirst column hard left, last column hard right, spare space shared equally between them.
space-aroundEqual space on both sides of every column.
space-evenlyEvery gap identical, including the ones at the two ends.

When you would use it

  • A single column should be centred in the page.
  • A logo on the left and a menu on the right: use "space-between".

How to change it

  1. Click any column in the row, then open "Entire Row" in the Modify drawer.
  2. Open "Horizontal Alignment" and click one of the diagrams.
One value, or one per device? Every input in this setting sits under a “Same value for all resolutions” checkbox. Leave it checked for a single value everywhere, or uncheck it to give phones, tablets, and desktops their own. How per-device values work.

Watch out for

  • If the columns already fill the row there is no spare space, so nothing appears to change.
  • This moves the columns. To move the text inside a column, use Text Align on the column.

Related settings

For developers

The technical reference for what this setting produces: MDN: justify-content. You do not need any of it to use the setting — it is there for whoever is building the components or debugging the published page.

Where to go next