CSS3 Click Chart | CSS3 Browser Support and Information

Word Wrap / Overflow Wrap

This property allows you to define how to handle line breaking. An alternate syntax is the old word-wrap, which has support in every browser, including old versions of IE.

Specification

overflow-wrap on W3C

Example Code

.element2 {
    word-wrap: break-word; /* or "normal" */
    overflow-wrap: break-word;
}

Live Demonstration

The one-word link shown below is too long for the width of this element, but it's broken onto two lines using the word-wrap property: Pneumonoultramicroscopicsilicovolcanoconiosis

Desktop Browser Support

Standard Syntax:
Chrome 23+, Opera 12.1+

Old Syntax ("word-wrap"):
IE5.5+, Firefox 3.5+, Chrome 4+, Safari, 3.1+, Opera 10.5+

Tools / Polyfills

Tutorials / Articles

New CSS3 Properties to Handle Text and Word Wrapping
Word-Wrap: A CSS3 Property That Works in Every Browser