We want to avoid long words overflowing the line and let them be broken if they have to, for which the standard approach is
word-wrap: break-word
Or its equivalent
overflow-wrap: break-word
However, we found this not to work on Safari (including Mac and iOS).
We then discovered by accident that the word-break CSS property, which is supposed to only accept a value of break-all, meaning to break anywhere at all, apparently takes an undocumented value of break-word (Chrome accepts this as well), and that the following
word-wrap: break-word;
word-break: break-word;
appears to solve the problem on Safari.
I was unable to find any references on the web either to the non-standard break-word value for word-break, or to any Safari "bugs" with word-wrap: break-word that using word-break: break-word would solve.
As far as I know word-break: break-word; is non-standard, webkit only. It can be found on Safari CSS Reference
word-break Specifies the level of strictness when breaking lines of text in ideographic languages such as Chinese, Japanese, and Korean.
Syntax word-break: strictness Parameters strictness The level of strictness. Constants break-all, break-word, normal Availability Available in Safari 3.0 and later. Available in iOS 2.0 and later. Support Level Stable CSS 3.