Workflow Short – Position Forms at Y=Top, X=Center

The two settings Workflow provides for the position of your forms is handled here:


When the checkbox is selected, your form turns out like this:


being both centered vertically as well as horizontally.

If the checkbox is unchecked, your form ends up in the corner:


In many of my forms, the UI flowed much better if the form were actually centered horizontally, but topped-out vertically.


To achieve this effect, leave this box checked:


Then, we’ll add a bit of CSS to the page by adding an IncludeHTML component.  Use a Merge Text component to build the CSS ahead of the form, like so:


The guts of the Merge Text component:


And the IncludeHTML component on the form designer:


That should do it.  At runtime, the form should be centered as expected.

Featured Components


Merge Text

Further Reading

CSS and Workflow

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s