Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • When you drag a panel from the palette and drop it on the canvas, the default width is 6 grid columns. Panels can be made as wide as 12 columns. Each panel is itself divided into 12 columns irrespective of its width. 



  • Panels do not take up visible use mode space i.e. a 6 column control outside a panel and a 12-column control inside a 6-column panel take up exactly the same width. You can edit the Width property of controls you drag inside these controls.

  • There is no Width property for sections or tables controls - they are always 12 columns wide. Each is itself divided into 12 columns. They are all exactly as wide as a regular 12 column control. An N-column control that is inside one of these will appear narrower than the corresponding N-column control outside. 



  • Repeats are also always 12 columns wide and each repeat is itself divided into 12 columns. Like panels, they take up no visible use mode space: a 12-column control outside a repeat and a 12-column control inside a repeat are exactly the same width. 



  • The total visible width of a date/time control with N columns is the same as the total visible width of any other control with N columns. The relative widths are constant so the space between the two reduces as the total number of columns reduces.



  • For tab controls, you access the width property by clicking the unlabeled area to the right of the last tab in your tab group; the width you specify will be applied uniformly to each tab in group. (See Panels and Tabs for more details.) When setting a control’s width property you may use standard CSS-relative values; for example, 5%, 5em, 5ex or 5px.

Width is a crucial property when designing mulit-column forms. makes this very easy to do. Refer to this documentation for some tips about the drag and drop feature when designing multi-column forms.

...