PDFPipe

Text and typography / hyphens

How to enable hyphenation in a PDF

hyphens: auto lets the layout break words at syllable boundaries, using a dictionary for the language declared on the document.

What it is for

In a narrow column, particularly in German, Finnish or any language with long compounds, hyphenation is the difference between an even text block and one full of rivers of whitespace.

Support: Works everywhere

Supported, and completely dependent on a lang attribute. Without one there is no dictionary to consult and the property does nothing at all, with no warning.

The syntax

Written the way it would appear in a document stylesheet, using hyphens as intended.

css
<html lang="de">   <!-- Required. Without it, hyphens: auto is inert. -->

.document {
  hyphens: auto;
  /* Do not hyphenate anything shorter than this. */
  -webkit-hyphenate-limit-before: 3;
  -webkit-hyphenate-limit-after: 3;
}

/* Never hyphenate identifiers, which have no syllables to break at. */
.reference,
.document code {
  hyphens: none;
}

The mistake people make

No lang attribute. This is the most common reason hyphens: auto appears not to work, and it is invisible because the CSS is correct.

Frequently asked

Does hyphens work when generating a PDF?

Works everywhere. Supported, and completely dependent on a lang attribute. Without one there is no dictionary to consult and the property does nothing at all, with no warning.

How would I know if it were not working?

You would not, from the CSS. Unimplemented and unmatched CSS both fail silently, which is why the reliable test is to set a deliberately extreme value and see whether anything changes. If a 40mm margin looks the same as an 18mm one, the rule is not reaching the page.

Related properties

Things that come up in the same part of a document stylesheet.

Paste the CSS and see what the rendered page does with it.