Search code examples
cssjustifyhyphenationtext-align

Can I use CSS to justify text with hyphenating words at the end of a line?

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?

Solution

  • 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 (&shy;) in words that might otherwise be hyphenated wrong.