Streaming live at 10am (PST)

Automatically Hyphenation for long Words

Hi there,

I need automatically hyphenation for long words or links (like “hyphens: auto;” in css). At the moment the words aren’t shown fully on a mobile device.

In webflow I can manage it with two textblocks. One for desktop with the long word and one for mobile with a hard-texted hyphen. But that this isn’t a good solution.

Greetings,
Kira


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Add the following code to an code embed element in your project:

<style>
   ."YOUR-ELEMENT-CLASS" {
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  }
</style>

Just change the quotation marks for your element class (remove the quotation marks)

Thank you!
Can you say me where I can add code in webflow? Is this possible when the website isn’t published yet?

CSS code works anywhere in the designer and yes you can see the results right there before publishing the site.

1 Like

wow so simple! thanks!

1 Like