Using Zen Components - InterSystems Documentation

Grid– If all width values are specified as percentages, the columns expand or shrink proportionally, toexactly match the size of the viewing space.5.9.6.2 Width of Data ColumnsYou can control the layout of contents by specifying column widths using the attributesrowLabelWidth and columnWidth and the attribute width. This topic explains how the values you choosefor these attributes affect the layout results. rowLabelWidthrowLabelWidth applies to the column of row labels that appears as the leftmost column in the grid. The column of rowlabels acts as a vertical header for the grid, and so it is not treated like elements, which contain grid data.Unlike the width attribute, the rowLabelWidth does not support percentage values. You mustspecify rowLabelWidth in pixels, for example 75px. The default is 100px. columnWidthcolumnWidth gives a default width for columns that do not supply a width. The columnWidth does not supportpercentage values. You must specify columnWidth in pixels, for example 75px. The default is 100px.columnWidth is essential to the default calculation when a uses the default width ("auto") and specifies all ofits width values as percentages. In this case, Zen computes a display width for the data columns usingcolumnWidth as described in the “ width” section.The total width of a is the total width of all data columns plus whatever number of pixels was specified forrowLabelWidth, plus the space needed to render any specified margins, borders or cell padding. The viewingspace sizes itself to display the entire grid. widthThe width attribute determines the width of individual data columns and may be specified in pixels (px) orpercentages (%). Pixels and percentages may be freely mixed among the elements in a given specification, with the following results:• A column width in pixels is always respected.• If some columns are specified in percentages and others in pixels, Zen uses the size of the pixel-based columns tocalculate the width of the remaining columns.• If all column widths are given as percentages and the has been given a fixed size, the grid performs ascale-to-fit operation such that the grid, any associate headers, borders, and column data exactly fill the defined viewingspace.If all the column widths are given as percentages and the has "auto" size or no size specified at all, the narrowestcolumn is assigned the width of the columnWidth, and all other columns are sized with respect to the size ofthis column, as follows:1. Find the with the smallest percentage value. This is the narrowest column.2. Consult the columnWidth value, assign this number of pixels as the width of the narrowest column, thenuse this result to calculate the number of pixels that corresponds to 1%.For example, if the smallest width is 5% and the columnWidth is 75px, Zen calculates thatthere are 15 pixels in every 1%, for a total width of 150 pixels across all data columns in this grid.3. Convert the percentage values for all other data columns into numbers of pixels.Using Zen Components 149