CSS minimum size

A CSS minimum size is a lower constraint imposed by a minimum-size property such as min-width or min-height. It can prevent a CSS preferred size or available space from shrinking the generated box below a specified dimension.^[ref]

For a simple content-box block with no padding or borders, width: 180px; min-width: 240px produces a width of $240$ CSS pixels, assuming no other relevant constraint. If its containing width is only $200$ pixels, the minimum still does not automatically become $200$: the box can extend beyond its container. The resulting CSS overflow is a separate issue from whether the minimum was obeyed.

Contradictory bounds are also resolved systematically. With width: 180px; min-width: 320px; max-width: 200px, the $320$-pixel minimum takes precedence over the smaller CSS maximum size in this ordinary sizing case. A constraint interval whose upper endpoint is below its lower endpoint cannot be satisfied literally; the layout rules specify which requirement governs.^[ref]

The value auto should be interpreted using the relevant specification and layout context; modern layout modes can give an automatic minimum content-dependent behavior. It is not universally interchangeable with explicitly writing zero. When diagnosing a box that refuses to shrink, inspect its minimum constraints, CSS box-sizing and layout rules rather than only its declared preferred width.