The text-box property controls the rectangular or shaped region inside an element that the inline layout engine uses for placing and wrapping text. Rather than directly changing fonts or spacing, it alters the container area that lines of text see: where line fragments begin and end, how they wrap around intrusions, and which parts of a block are considered available for text. This makes it a layout-facing tool you use when you need the typographic flow to conform to a particular geometric region inside an element without altering the element’s border or padding boxes.

Practically, changing the text-box affects line breaking, hyphenation points, and where overflow or truncation occurs. Because it redefines the region used by the line layout algorithm, it works closely with line metrics and alignment rules — for example, it changes how line-height distributes space and how inline elements align vertically relative to that region (vertical-align). When the text area is inset, wrapped, or clipped, the behavior of edge cases such as clipped descenders or adjacent floats can change, so think of text-box as altering the canvas the text paints onto rather than the text itself.

You’ll most often use text-box for advanced typographic and layout effects: shaping text around decorative content, creating inset reading areas for pull-quotes, or fitting text into non-rectangular art direction in a responsive design. It complements shape-based layout techniques (see shape-outside) and interacts with box-sizing decisions (box-sizing) and floating elements (float) when you need precise flow control. Be mindful of how it affects overflow and clipping behaviors that other properties manage, such as text-overflow and whitespace handling (white-space), and ensure any visual shaping preserves logical reading order and accessibility.