Contents

Widget Max Width

The largest width the widget is allowed to grow to on the host page.

Where to find it
Labelled Max Width in the Widget Settings drawer (gear in the widget header).
Per device
Yes — you can set one value for every screen, or separate values for phone, tablet, and desktop.
Underlying CSS
maxWidth

In plain English

Caps the widget so wide host pages do not stretch it endlessly. Pair it with left and right Margin of "auto" to centre a readable embed — that centring recipe is the most common widget-level sizing pattern.

When you would use it

  • A widget should never exceed a comfortable reading width on large monitors.
  • You want a centred embed: Max Width plus Margin left and right set to "auto".

How to change it

  1. Open Widget Settings, then "Max Width".
  2. For the centred-embed recipe, also set Margin left and right to "auto".
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

  • This setting is left out on the editing canvas so the drag-and-drop surface stays full size. Open Preview to see it applied — nothing will look capped while you are editing.
  • Max Width does not centre anything by itself. Add "auto" left and right margins.

Related settings

For developers

The technical reference for what this setting produces: MDN: max-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