- Where to find it
- Labelled Min Width in the "Selected Column" 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
minWidth
In plain English
Min Width is a safety net. It says "this column can be as wide as it likes, but never narrower than this". Everything else about the layout carries on as normal until the column is about to get too narrow, at which point the floor holds.
It earns its keep in flexible layouts. Three cards sharing a row will happily squeeze themselves thinner and thinner as the window narrows, until the text inside is one word per line. Giving each card a min width of, say, 200px stops the squeezing and lets them wrap onto the next line instead.
When you would use it
- Cards or columns become unreadably narrow when the browser window shrinks.
- A button or badge should never collapse to less than a sensible size.
- You want items to wrap onto a new line rather than compress — combine this with the row's Flex Wrap setting.
How to change it
- Select the column, open "Selected Column", then "Min Width".
- Enter a number and choose a unit. Pixels are the most predictable choice here.
- Narrow your browser window, or use the phone preview, to confirm the floor is doing its job.
Watch out for
- Min Width wins over Width. If you set a width of 100px and a min width of 300px, the column will be 300px.
- A min width larger than a phone screen forces sideways scrolling. Keep it modest, or set it only for tablet and desktop.
- This is a floor, not a target. On its own it does not make the column any wider than its content needs.
Related settings
For developers
The technical reference for what this setting produces: MDN: min-width. 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
- Back to the full attribute reference
- The Composer — the editing surface these settings live in.
- Publishing — how a change like this reaches your live site.