Shrinkwrap Showdown — Pretext Demo

Container width 340px

CSS fit-content

Uses fit-content + max-width: 80%. Sizes to the longest line — shorter lines leave dead space.

Pretext shrinkwrap

Binary-searches the tightest width that keeps the same line count. Zero wasted pixels, zero DOM measurement.

Why can't CSS do this?

CSS only knows "fit-content" — the width of the widest line after wrapping. If a paragraph wraps to 3 lines and the last line is short, CSS still sizes the container to the longest line. There's no CSS property for "find the narrowest width that still produces exactly 3 lines." That requires measuring text at multiple widths and comparing line counts — exactly what Pretext's walkLineRanges() does, without touching the DOM. Pure arithmetic, no reflows, instant results.