The word-break property in CSS allows us to control how words should be broken and wrapped when they exceed the width of their container.
It is particularly useful when dealing with long words or strings of characters that do not contain spaces.
Breaks words according to their usual rules.
span {
word-break: normal;
}
span {
word-break: break-word;
}
Deprecated value, same as break-all. It was part of older versions of the CSS3 specification.
span {
word-break: break-all;
}
span {
word-break: keep-all;
}
Allows words to break at any point if they exceed the container's width.
Prevents breaks within words for languages that do not use spaces between words.
Use "break-all" when we want to allow long words to break and wrap within the container.
Use "keep-all" for languages where breaking within words is generally not desired, such as "Chinese" or "Japanese".
Avoid using "break-word" as it's deprecated; use "break-all" instead.