Adding manual hyphenation to your site with Elm

Hey all,

Just wanted to share this knowledge. If you want to do some manual hyphenation of your text in Elm, you can do it like so:

p
  []
  [ text "superlong\u{00AD}word"
  ]

The \u{00AD} Unicode character is properly parsed and works like charm :slight_smile: . This character tells the DOM to add a hyphen in case the word’s width exceeds its container’s width.

The reason I share this is because I tried using the HTML encoded string (­), and got lost in the “innerHTML no longer works” rabbit hole. Finally I figured out that a Unicode string would probably work, and luckily it did! Since there was no topic on this forum yet covering the subject, I want to help future developers having the same problem.

Cheers!

22 Likes

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.