I’ve not discovered a technique to specify {that a} slash ought to be handled like a hyphen.
One potential workaround is so as to add the model overflow-wrap: break-word;. This can enable lengthy phrases to interrupt with out affecting the breaking of different phrases. However it can simply break at no matter character would trigger overflow, it doesn’t desire breaking at slash characters.
Breaking at particular characters, such because the slash character, can’t be completed in CSS, it’s important to do it in HTML. You probably have entry to the HTML code (in a publish physique, for instance) you possibly can select any of those options:
<wbr>phrase break alternative tag​zero width house​zero width house
However these don’t work for a publish title in WordPress, as a result of WordPress will filter out any code you enter right into a publish title. The best way to unravel that is to insert a number of zero-width-space characters straight into the title. A technique to do that is to make use of Character Viewer (Mac) or Character Map (Home windows), though after all they’re a bit tough to make use of relating to areas as a result of areas are invisible. Within the case of Character Viewer, whenever you seek for arrow, numerous matches seem, however whenever you seek for zero width house, it seems that no characters had been discovered. However in case you click on the place the blue sq. is within the second picture beneath, you’ll uncover that the character was discovered, it’s simply invisible.
Â
And you may see the consequence:
Â
Extra particulars can be found in this reply on Stack Overflow, together with a snippet to exhibit the variations between the varied HTML options.
