The row and column combination define the top left coordinates for a control, and boundaries for those controls filling a space. This works well for simple layouts, but more complex requirements often mean that it's necessary to add multiple rows and columns, some of which may be of different sizes. It goes without saying that the more rows and columns that are added, the smaller the cells will be, with the result that it is necessary to increase the space occupied by a control.
Figure 13 – Column span
Figure 13 shows a more complicated layout. The page has been divided in to 5 rows and 5 columns of varying sizes, although this is more than enough to allow for this layout.
The heading is positioned in row 1, column 1 and span 5 columns so that it fills the width of the whole page. The list on the left is in row 2, column 1, has a row span of 4 and a column span of 2.
The fields on the right hand side are all positioned in row 2, column 3. The shorter fields span 2 columns and the longer ones span 3. The columns are all proportional, so when the page is resized, the controls resize according to the space available, and of course, they adhere to the boundaries defined by the columns.
Figure 14 – Column span
Row and column span can be set by changing the values for the control in the ribbon, or simply by dragging the control in the designer and making it larger or smaller as required.