Adjust Layout with Column Properties

Once the Column Sets and Group box are placed, users can adjust the following:

• Name: Name of the column.

• Ratio: Describes the width of a Column relative to the other Columns in the same Column Set.

  

  

  • Example: A Column Set contains 2 Columns where one has a ratio of 2 and the other has a ratio of 1 (2:1). This means the first column will be twice as wide as the second column and occupies two thirds of the width of the Column Set.
  • Example: A Column Set contains 3 Columns with a ratio of 2:1:1. In this case the first column will be twice as wide as the second and third columns, meaning it occupies half the width of the Column Set.
• Min Width (px): Minimum width that a Column will shrink to
• Max Width (px): Maximum width that a Column will expand to

When considering sizing behavior of Columns, it’s important to note that a Column’s width settings take priority over its ratio.

For example, consider a Column Set with two Columns. Column A has a Min Width of 300px and Ratio of 2. Column B has a Min Width of 100px and a Ratio of 1. This ratio of 2:1 indicates that Column A should be twice as wide as Column B. However, the parent Column Set can shrink down until all child Columns hit their respective minimum widths. In this case, Column A will shrink to 300px and Column B will shrink to 100px – resulting in an actual ratio of 3:1.

If maintaining the width of Columns in relation to each other is important for a Form’s design, be sure any Min or Max Width follows the desired ratio.