When you create a Form page with the APEX Wizard it puts all the fields in just one column which can create a very long page.

This can reduce the use experience and usability a lot.

Sometimes it is a better way to put the fields in two (maybe three) columns and present them all on one screen. This gives the user the benefit of seeing all the information at once.

The easiest way of getting a two column Form in APEX is creating the Form with the Wizard and setting the attribute “Begin On New Line” for every second item to “No”.

This gives you a Form like this:

As you can see the 2 columns are right next to each other, they don’t use the space on the right side at all.

It would be much nicer, if there would be some space in between those 2 columns, so that the first column is on the left side of the screen and the second one on the right side of the screen.
If there is more space (larger screen/window) the space between the columns should expand, if a smaller window/screen is used the space between the columns should shrink until it disappears.

If you want to try how this feels you can use this demo-app on apex.oracle.com.
Pick any entry from the list, click the edit-icon and increase/decrease the size of your browser window.

How does it work?

Well, there may be many different solutions to solve this. One of them is the one i used: insert a blank table-column.

Huh?
Ok, from the start: APEX uses HTML Tables to layout the screen.

• In a 1-column Form Layout there is a HTML Table with two columns. The First column holds the label, the second column holds the item itself.
• In a 2-column Form Layout (as in the middle picture) there are four columns use. Columns one and three hold labels, columns two and four hold items.

When we insert a new column on position 3 (where you can see the red arrows in picture 3) and give this column the command to use as much space as it gets, the layout will adapt as we want.

To insert the new column we simply add </td><td width=”50%”>&nbsp; to the “Post Element Text” of the items in the first column.

That’s all, enjoy!