"When there isn't enough space to display text, it gets wrapped onto the next line, preventing overflow. This is the default behavior, so you don't need to do anything to enable text wrapping. You can see it in action in this very paragraph. However, the text-wrap CSS property defines how it gets wrapped, although we can also use it to turn text wrapping off. The property accepts five values:"
"wrap is the default value. Whenever this value is the computed value (again, as it is right now in this very paragraph), text will be wrapped whenever there's no more space on the line, although only at sensible points so as not to disrupt readability. For example, text wrapping won't occur in the middle of a word (look into the overflow-wrap and properties if you do need this to happen, though):"
The text-wrap CSS property specifies how inline text wraps when it reaches the edge of its container. It reached 'Newly available' Baseline status in 2024, so current stable browser versions support it while older ones may not. The property accepts five values; common ones are wrap (default), nowrap (disables wrapping and allows overflow), and balance (tries to equalize line lengths to avoid bad rag). wrap preserves readability by breaking at sensible points, while nowrap forces overflow. balance redistributes words across lines to create more symmetrical, visually appealing text. overflow-wrap and related properties control breaking inside words when needed.
Read at LogRocket Blog
Unable to calculate read time
Collection
[
|
...
]