Arranging grid items and grid cells with alignment and justification rules
By default, all grid items are arranged within the grid cells in a stretched manner. Think of the Awesome Analytics dashboard. The following figure of the dashboard illustrates this behavior:
Figure 3.1 – The Awesome Analytics dashboard with its sidebar and some chart boxes marked with colors
The sidebar (1), marked with a red border, stretches to fill the entire height. We can see this with the white and gray backgrounds. Its content wouldn’t take up that much space, in any case. The same behavior applies to the chart boxes.
We see in the first row that a pie chart fits in a single grid cell, as shown in the chart box marked with blue (2), but the chart stretches to its available space when defined as such, as illustrated by the chart box marked in orange (3).
In most cases, this is the expected and desired behavior. However, in some cases, we’d like...