Add utility class for word-wrap/word-break

[0xadri]

Relevant pull request: #19316

Very long words can break out of its containing tag.

One can force these long words to break to the next line(s) if necessary.

See an example on https://jsfiddle.net/AdrienBe/n16vqz5p/

Resources:
http://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/
http://stackoverflow.com/questions/320184/how-to-prevent-long-words-from-breaking-my-div
http://caniuse.com/#search=word-wrap
http://stackoverflow.com/a/22811590/759452
http://developer.mozilla.org/en-US/docs/Web/CSS/word-wrap

[eddyerburgh]

I suggest adding this to body :

body {
  // Stop words overflowing 
  word-wrap: break-word; 
}

[vanillajonathan]

https://getbootstrap.com/docs/4.0/utilities/text/

There is the .text-nowrap class and the .text-truncate class. There is no class to force long lines uninterrupted words to break into new lines though.

Perhaps there ought to be a .text-wrap or .break-word class.

.text-wrap {
  word-wrap: break-word; 
}