Force words to break that cannot fit within the available space
If a word (really a sequence of non-space characters) cannot fit within the available space (i.e., a single line), and hyphens are either disabled or don't apply, force the word to break.
The solution has two parts. First, for main content, the following declaration will break the word if it doesn't fit within the available space:
.body {
word-wrap: break-word;
}
(Note the word-wrap
is the legacy name for overflow-wrap
, but works everywhere).
Within a table cell, the definition of available space differs. What we want is for the table to not exceed its bounds. In order for that to happen, we need to use a more aggressive setting:
.doc th.tableblock,
.doc td.tableblock {
word-break: break-word;
}
The word-break
property is kind of like overflow-wrap
, but for table cells. It's slightly more aggressive in that it gives white-space higher precedence than a hyphen opportunity. However, there's no other known alternative.