text-wrap

text-wrap: wrap | nowrap | balance | pretty | stable

Steruje tym, jak tekst zawija się w wiersze. Oprócz włączania i wyłączania zawijania potrafi wyrównać wiersze wielowierszowego nagłówka (balance) albo dopasować koniec akapitu tak, by w ostatnim wierszu nie został pojedynczy wyraz (pretty).

Wartości

  • wrap – domyślnie: zwykłe zawijanie.
  • nowrap – bez zawijania.
  • balance – mniej więcej równo długie wiersze. Przeglądarki robią to tylko przy krótkich tekstach (kilka wierszy), więc jest to przeznaczone dla nagłówków i podpisów.
  • pretty – lepsze zawijanie na końcu akapitu (przede wszystkim bez pojedynczego wyrazu w ostatnim wierszu). Wolniejsze, do zwykłego tekstu.
  • stable – przy pisaniu w edytowalnym tekście wcześniejsze wiersze nie zawijają się na nowo.

Jest skrótem dla text-wrap-mode (wrap/nowrap) i text-wrap-style (balance, pretty …).

Wartość początkowa: wrap. Dziedziczona: tak. Dotyczy: wszystkich elementów.

Przykłady

Nagłówek bez wyrównania i z balance:

<h3>Jasny i wymowny nagłówek, który zawija się na samym końcu</h3>
<h3 class="balanced">Jasny i wymowny nagłówek, który zawija się na samym końcu</h3>
h3 {
  max-width: 300px;
  margin: 0 0 10px;
  font: 700 20px/1.3 Arial, sans-serif;
  border: 1px dashed #999;
}
.balanced { text-wrap: balance; }
Wynik

Jasny i wymowny nagłówek, który zawija się na samym końcu

Jasny i wymowny nagłówek, który zawija się na samym końcu

Akapity bez pojedynczego wyrazu na końcu (w Firefoksie jeszcze nie działa, tekst zawija się jak zwykle):

p {
  text-wrap: pretty;
}

Na co uważać

  • Wszystkie duże przeglądarki obsługują właściwość jako całość od 2024 roku (Chrome 114, Firefox 121, Safari 17.4). Wartości pretty Firefox jeszcze nie ma; Chrome ma ją od wersji 117, Safari od 26 (stan na październik 2026). W starszej przeglądarce tekst po prostu zawija się jak zwykle – można jej używać bez ryzyka.
  • balance nie zmniejsza szerokości elementu, tylko rozkłada tekst na wiersze – po prawej zostaje wtedy wolne miejsce (widać to przy nagłówku z tłem albo ramką).
  • Nie używaj balance do długich akapitów – od pewnej liczby wierszy przeglądarka je pomija i liczy na próżno.

Obsługa w przeglądarkach

Baseline – szeroko dostępne: we wszystkich popularnych przeglądarkach od marca 2024, za szeroko dostępne uznawane od września 2026. Od wersji: Chrome 114, Firefox 121, Safari 17.4. Stan: październik 2026 (MDN browser-compat-data).

Zobacz też:
white-space
hyphens
text-align