Объявление word-break: break-word
является нестандартным и зависит от браузера. Он плохо документирован, но, вероятно, намеревается сделать то же, что и word-break: break-all
согласно CSS 3 Text . Это означает, что допускается разрыв строки в любой точке, даже внутри слова, просто разрыв в любом месте (без вставки дефиса). Это может быть приемлемо в некоторых контекстах, но, конечно, не для обычного английского текста, например.
В качестве совершенно не связанного вопроса, чтобы слово не отображалось в одной строке, вам нужно связать его вместе со смежным словом. Простейшим способом является использование пробела без перерывов вместо обычного пробела, например замена <p>... foo bar.</p>
на <p>... foo bar.</p>
Чтобы сделать то же самое в CSS, вам нужна дополнительная разметка: <p>... <span style="white-space: nowrap">foo bar.</span></p>