= CSS preferred size
{c}
A <CSS preferred size> is a size requested by a preferred-size property such as `width` or `height`. The final layout also depends on the applicable sizing algorithm, the <CSS containing block> and any <CSS minimum size> or <CSS maximum size>. Preferred therefore identifies an input to sizing, not an unconditional measurement of the final box.<CSS Box Sizing Module Level 3 by World Wide Web Consortium>[§3.1, Preferred Size Properties; minimum and maximum size properties]{ref}
For a simple content-box block with no padding or borders, consider `width: 300px; max-width: 100%` in a 200-<CSS pixel> containing block. The maximum constraint limits the used width to 200 pixels. With a sufficiently wide containing block, the same preferred width can instead yield 300 pixels. The example assumes no other minimum constraint.
Values such as `auto`, percentages and content-based sizing keywords have context-dependent meanings. A percentage can depend on whether the relevant containing dimension is definite, and auto sizing can use different rules for ordinary blocks and <CSS replaced elements>. The word auto is not a universal synonym for one numeric width.
The properties also have applicability limits. A non-replaced inline box is not made into a fixed-size rectangle merely by assigning width and height. Relating a <CSS preferred size> to a <CSS used value> requires identifying the box kind and the layout rules that resolve its constraints.
Back to article page
