Adding manual hyphenation to your site with Elm

Show and Tell
1

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
2

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