Enables words to wrap even if they are longer than their container.
Compatibility
word-wrap Firefox 4+ Safari 5+ Internet Explorer 8+ iOS 3.2+ Android 2.1+ Opera Mini 5+ Blackberry 7+ IE Mobile 10+
overflow-wrap Safari 7+, Chrome 31+ Opera 19+
Supported by all modern browsers. Since overflow-wrap has replaced the old word-wrap property, you have to use both for compatibility reasons. For detailed compatibility info see caniuse.com.
Firefox 4+Safari 5+Safari 7+, Chrome 31+Internet Explorer 8+Opera 11+
iOS 3.2+Android 2.1+Opera Mini 5+Blackberry 7+IE Mobile 10+
General description
overflow-wrap: 1 normal
1 The default behaviour of a word that has no positions to wrap (space or slash) and is longer than its container is to simply overflow it.
Example
Wrapping enabled
overflow-wrap: 1 break-word
1 Now the word doesnt overflow the container but rather breaks as soon as it reaches its boundaries.
Further reading
For more info see the W3C site, the Safari site, the MSDN site and the site at MDN (including compatibility info for older browser versions).
text-overflow
Controls how text is displayed when it is longer than its containing area.
Compatibility
-o-text-overflow Opera Mini 5+
text-overflow Firefox 7+ Safari 5+, Chrome 10+ Internet Explorer 9+ Opera 11+ iOS 3.2+ Android 2.1+ Blackberry 7+ IE Mobile 10+
Supported by al modern browsers. For detailed compatibility info see caniuse.com.
Firefox 7+Safari 5+, Chrome 10+Internet Explorer 9+Opera 11+
iOS 3.2+Android 2.1+Opera Mini 5+Blackberry 7+IE Mobile 10+
General description
text-overflow: 1 clip
1 The default behavior of words within a text paragraph, which are longer than its container. They simply overflow its boundaries. This is closely related to the overflow property. As soon as it is set to hidden, the text gets clipped, at auto the container becomes scrollable until the end of the text is reached.
Examples
Abbreviated with the ellipsis character
text-overflow: 1 ellipsis
1 As soon as overflow is set to hidden longer words get clipped at the end and abbreviated with the ellipsis character. Only works in combination with the mentioned overflow value.
Text running in one line
text-overflow: 1 ellipsis
1 Another property that is closely related to text-overflow is white-space. When it is set to nowrap the whole paragraph runs in one line, detaining it from wrapping.
Further reading
For more info see the W3C site, the Safari site, the MSDN site and the site at MDN (including compatibility info for older browser versions).