Dealing with long words in CSS

Link: Dealing with long words in CSS

Final solution

.hyphenate
overflow-wrap: break-word;
word-wrap: break-word;
-webkit-hyphens: auto;
-ms-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}

view raw
long-word.css
hosted with ❤ by GitHub

This solution will show hyphens for every browser supporting it and will break lines in every other browser – perfect.

This is a useful technique when you need to deal with long words in your web design. For example, when you need to reference a long city name.

Makzan
I teach web design. I write books on HTML5 games development. I host classes on mobile web and app development. I made animation with Adobe Flash (now Animate).

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.