In this section, we will learn what the word-wrap property is and how to use it in CSS.

CSS Text Wrapping: CSS word-wrap Property Definition and Usage

The CSS `word-wrap` property is used to break a long word if that causes an overflow in an element and wrap in into the next line.

CSS word-wrap Property Syntax

word-wrap: normal|break-word|initial|inherit;

CSS word-wrap Property Value

–normal: This value means break words only at the allowed break points.

– break-word: using this value means allowing unbreakable words to be broken.

Note: the two global values “initial” and “inherit” can also be used for this property.

Example: wrapping text in CSS

See the Pen wrapping text in CSS by Enjoy Tutorials (@enjoytutorials) on CodePen.