I was working on a website today and I noticed the word long-term got split along the hyphen into long- and then term on the next line. This is really not what I want.
First thing I thought would solve my problems is the
white-space CSS property, but this is not what it does. Although you could set it to
nowrap, but with longer texts like in my paragraph, this will just overflow. This is only useful for titles maybe.
The solution turned out to be the
This will only split along whitespace characters, which is precisely what I want. With extremely long words it will still overflow, but my text is in english, so it should be fine.
<p class="break-keep">Thanks for reading!</p>