This is about the new css spec overflow-wrap.
MDN says break-word is the same as anywhere except
soft wrap opportunities introduced by the word break are NOT considered when calculating min-content intrinsic sizes.
What does it mean?
Difference between overflow-wrap: anywhere & overflow-wrap: break-word?
Viewed 225
1 Answers
Most of the time they're very similar.
One case when they're different: when you have a super long word (like an url) that is longer than the width of the container, and the container is a flex item with flex-grow, then anywhere will break the long word, whereas break-word will try to grow aggressively and avoid breaking the word when possible, which may squeeze other flex items out of proportion.
In this case, anywhere is more likely what you want. If that's true, you might as well do this:
overflow-wrap: break-word;
overflow-wrap: anywhere;
Because browser supports of break-word is better than anywhere, and browsers that don't support anywhere will ignore the 2nd line, which is not too bad.
Related