Content that sizes itself

A text field usually keeps its preset width, even when its content is much shorter or longer. field-sizing: content lets the field follow its text, growing wider at first, then wrapping onto new lines when it reaches the available width. Keep typing or add a line break to see the field grow taller. MDN documents the property and browser support.

Multicolumn content has a different problem: extra columns can run out of the visible inline space. column-wrap: wrap moves overflow columns onto another row when a fixed column-height is set. Change the number of entries to see the layout respond. The declaration remains experimental, so unsupported browsers show a labelled flexible list. See MDN’s column-wrap reference.