Sizing based on the outer container defining the overall size of a page is a relatively simple scenario. However, sizing the outer control based on the content presents some complications, particularly when the parent chain becomes a few layers deep. It's important therefore to understand how the overall size of a page is derived.
Figure 15 – Determining content size
Figure 16 shows a pale blue panel. This has been given a one row, one column layout, with margins of 20 pixels all round. The dotted lines on the right and bottom show the extent of the layout. The panel is also defined as sizing to the height and width of its content, which in this case is labels 1, 2, 3 & 4.
Label 1 is not laid out in any way, and is the control furthest to the right. It therefore defines the width of its parent.
Label 2 is not laid out in any way, and is the control furthest down the panel. It therefore defines the height of its parent.
is laid out. It's centered and sizing so that it fits the width. Logically, if the label is fitting to width, it cannot be used to determine the width of its parent container. It can however still affect the height.
Label 4 is not laid out in any way and is positioned so that its top and left have negative values. At first glance it may seem that the panel should resize to accommodate the label. However, content sizing works by starting from the top left of a control, and assessing the position of child controls within it bounds. Negative top and left positions are therefore ignored for the purposes of calculation.
