Modern browsers have made different choices when it comes to wrapping words and hyphenation in response to different device sizes. Newer options for controlling the output have been added to CSS coding but not all browsers have adopted them in the same way. As you can imagine, there’s been some confusion.
COFA Drupal Kit Goals for Hyphenation
It is a work in progress but the web team’s goal is for our websites to be consistent from browser to browser and to provide more control to our content creators.
As of 2025 you should expect the following on our Drupal sites:
- Headings (H1 – H6) tags and navigation will not hyphenate. Complete words should flow to the next line. If the space a word is contained in becomes too small the letters will wrap to the next line.
- Paragraphs, lists and other text should automatically hyphenate but only on words that are at least 10 characters, with a minimum of 3 characters before and 4 characters after the hyphen.
Manual Control of Hyphenation for Content Creators
If you are not happy with the hyphenation of your text you may try the option within the Styles drop-down of the Rich Text Editor buttons.
The Web team is working on more options to allow content creators to better control hyphenation on headings and titles.
As this is in flux, some additional options may work in some contexts and be worth try. If something is really displaying poorly, contact the web team.
