Moving, resizing and aligning widgets in Fluid UI

Use the grid view in view settings to align widgets pixel by pixel. You can set the number of pixels in each square in the grid.

The snap to grid option will also help align widgets to the nearest pixel.

Use your keyboard's arrow keys to align widgets by moving pixel by pixel.

Automatic alignment
Select two or more widgets and the vertical/horizontal align icons will appear in the widget menu.

There are 6 options in total:

  • Align Left - aligns the widgets/groups to the left.

  • Align Right - aligns the widgets/groups to the right.

  • Align Center - aligns the widgets/groups to the center.

  • Align Top - aligns the widgets/groups to the top of the selection.

  • Align Middle - aligns each widget to the middle of the selection.

  • Align Bottom - aligns the widgets/groups to the bottom of the selection.

Send to front/back

Select any widget or widget group and use the arrows to send them to front or back.

  • Send to Front - places the selected widget behind all others on the page.

  • Send to Back - places the selected widget in front of all others on the page.

  • Send Backwards - moves a widget behind the previous widget.

  • Send Forwards - moves a widget in front of the one above.

You can define the alignment and z-depth for a widget from the widget menu and in using pinned widgets (often used in conjunction with scrolling pages)