Shrunk headings and a turned label

Headings of different lengths shrunk to share one column, and a label turned a quarter turn up the page's spine.

Two things a layout does so that nothing has to be measured by hand. A heading of unknown length — a product name, a customer's company, a translated title — is set at the largest size at which it still fits its column, so three headings of very different lengths come out at three sizes, each filling the same width.

The second is a quarter turn: a block of text set on its side about a point you choose, here running up the left margin like the title on the spine of a book. Both are the same idea — you state the box and the intent, and the engine works out the numbers.

What this example shows

  • The largest size at which a line still fits its column.
  • Text turned a quarter turn about a point you choose.
  • Headings of unequal length brought to one common width.

The code, in full

The same document is written twice, once in each language. Both files are shown in full, with the code coloured on the server, and can be copied in one click.

The document itself

The same document is written in each of these languages. Open the one you want to look at.

Open the document in English Open the document in French

Read the Rust source Read the Python source

First page of Shrunk headings and a turned label

What this document weighs

Before 108,630 bytes
Now 38,026 bytes
Saved 65.0 %

Not one mark on the page changed. See every document measured.

Examples near this one

Soft hyphens and no-break spaces

A justified column set twice: the long words breaking at their soft hyphens with a hyphen shown, or left whole, and a figure a no-break space keeps together.

Break points after a slash or a hyphen

A justified column set twice: file paths and compounds running past the edge with no break points, then wrapping where a break after a slash or a hyphen is allowed.

Text poured into columns

One long passage poured into three columns, each fitting the lines its height allows and handing the rest to the next.

Every example, by subject