I have a div that is too narrow to text-align:justify (gaps too wide), but yet looks un-uniform when right- or left-justified, because then there is a large gap at the end of lines. Left-justified looks best, but could I use hyphenation, like in books? Using CSS?
3 Answers
You can use hyphens: auto
provided that you have declared the content language in HTML, e.g. using <html lang=en-US>
.
Browser support is still limited but getting better, see http://caniuse.com/css-hyphens
For good quality, you may need to manually control hyphenation e.g. by using soft hyphens (­
) in words that might otherwise be hyphenated wrong.

- 195,524
- 37
- 270
- 390
Hyphenation is language-dependent; you can't just put overflowing characters on the next line and get the same effect that you do in books. Hyphenation rules are actually pretty complicated (see http://dictionary2.classic.reference.com/writing/styleguide/division.html), and the only way that you can do it properly (like in books) is either manually or via a client-side or server-side script; I'm pretty sure it can't be done using only css.
You might want to use something like http://code.google.com/p/hyphenator/

- 525
- 3
- 13
-
No, I know about hyphenation rule. The "books" I am referring to are the ones whose text is justified and they simply break off words and hyphenate it and stick it on the next line, not following the rules of hyphenation. I learned the rules of hyphenation in middle-school. – Mar 01 '12 at 06:19
-
1hyphenator works! if it supports your language. But if you have 3 or 4 languages the script file will weight about 200kb. There is also phpPyphenator, it will hyphenate your text on server. Much better than javascript file. Though it doesn't support some languages – Alex Reds Aug 08 '14 at 09:07
For hyphenation in html, there are javascript programs to add what's needed to the text. such as http://code.google.com/p/hyphenator/
Support for brower buildin hyphenation is unreliable and improvement in its support is doubtful.

- 73,243
- 15
- 104
- 123