I have a style in CSS that I use to cover the phrase I need (usually 2 words). I want these two words not to be separated by a line break.
For example,
... blah blah blah & lt; span class = "class1" & gt; two words & lt; / span & gt; blah blah blah blah ...
Suppose, after the word “two”, I should have a line break (because it ends), but in this case, I want the transfer to take place BEFORE the word “two”, that is, the phrase “two words” is transferred immediately.
Word-wrap is spelled out globally for the document: break-word;
Answer 1, authority 100%
Use white-space: nowrap for an element that shouldn’t have word wrapping.
. class1 {white-space: nowrap}
.class1: hover {white-space: normal}
div {word-wrap: break-word; width: 130px; border: solid} & lt; div & gt;. blah blah blah & lt; span class = "class1" & gt; two the words & lt; / span & gt; blah blah blah blah ... & lt; / div & gt; Answer 2, authority 50%
CSS option: add white-space: nowrap to the span that you wrap the phrase with.
Option with HTML: use nobr tag instead of span .
Answer 3
To do this, it is enough to use non-breaking spaces when writing, & amp; nbsp; that is, it will look something like this:
& lt; span class = "class1" & gt; two & amp; nbsp; words & lt; / span & gt;
Another option, if this is user data and you are using PHP, then you can do the following magic with the passed string:
$ string = str_replace ('', '& amp; nbsp;', $ string);
Thus, all spaces in the transmitted string will be replaced with non-breaking problems.