Text Wrap

Text Wrap fixes the small typographic annoyances that make otherwise-great designs look off: a single orphaned word on its own line, or a headline that breaks into wildly uneven lines. It puts modern CSS text-wrapping — the kind print designers have always had — one click away in the block toolbar.

Using It

Select a Paragraph, Heading, Post Title, or Post Excerpt block and click the Text Wrap button in the block toolbar. Choose one of three modes:

  • Default — the browser’s normal line wrapping.
  • Pretty — the browser avoids leaving a lone word stranded on the last line. Ideal for paragraphs and excerpts.
  • Balance — lines are balanced to roughly equal lengths. Ideal for headings, where a two-line headline looks dramatically better as 50/50 than as 90/10.

The change previews instantly in the editor and applies on the frontend with pure CSS — no scripts.

Tips

  • A good default recipe: Balance on headings, Pretty on introductory paragraphs. That combination alone makes most pages feel more designed.
  • Because it responds to the real rendered width, it keeps working as text reflows across screen sizes — no manual line breaks to maintain.
  • These are progressive enhancements built on modern CSS: browsers that don’t support a mode simply show normal wrapping, so there’s no downside to using them everywhere.

On this page