typeplate/typeplate.github.io

Finer grained control of hyphenation with CSS4 Text

Opened this issue · 0 comments

Was reading the article Finer grained control of hyphenation with CSS4 Text and had my #mindblown. Hello hyphens my old friend.

// allows you to specify the maximum number of lines in a row that a word will be hyphenated. 
// Supported in IE10 and Safari using -ms- and -webkit-
hyphenate-limit-lines: 2;

// You can set these limits with the hyphenate-limit-chars property. It takes three space
// separated values. If all are set, the first is the minimum character limit for the word
// before hyphenation, the second is the minimum characters before the hyphenation
// break, and the last is the minimum characters after the hyphenation break. 
// Currently only supported by IE10 using -ms- as of 3/15/13 
hyphenate-limit-chars: 6 3 2;

// Setting the hyphenation zone.
// Specified using a length value or a percentage
// Support is limited to IE10
hyphenate-limit-zone: 40px;

// specifies if hyphenation is applied on the last line of an element, 
// column, page, or spread
hyphenate-limit-last: column;