coderef

text-wrapBaseline · Newly available

The text-wrap CSS property sets how lines break in text that overflows the container. It is a shorthand for text-wrap-style and text-wrap-mode.

Works in the latest version of every major browser, but older devices may not support it yet. Baseline since Oct 17, 2024.

Browser support

DesktopChrome
1–129Not supported
130+Supportedsince Oct 15, 2024
Current: 155
Edge
12–129Not supported
130+Supportedsince Oct 17, 2024
Current: 154
Firefox
1–123Not supported
124+Supportedsince Mar 19, 2024
Current: 157
Safari
1–17.4Not supported
17.5+Supportedsince May 13, 2024
Current: 27
MobileChrome Android
18–129Not supported
130+Supportedsince Oct 15, 2024
Current: 155
Firefox Android
4–123Not supported
124+Supportedsince Mar 19, 2024
Current: 157
Safari iOS
1–17.4Not supported
17.5+Supportedsince May 13, 2024
Current: 27

How to use

Every current browser supports this, but it only became Baseline on Oct 17, 2024. Use it as a progressive enhancement, or keep a fallback if you support older devices.

Example

Full syntax and examples are on MDN: text-wrap.

Feature detection

CSS · check before using
@supports (text-wrap: initial) {
  /* styles that rely on text-wrap */
}

/* or in JavaScript */
if (CSS.supports("text-wrap", "initial")) {
  // use it
}

Sub-features

Support for each part of the feature (10). The overall table above shows when the whole feature works.

Sub-featureChromeEdgeFirefoxSafariChrome AndroidFirefox AndroidSafari iOS
text-wrap11411412117.411412117.4
text-wrap-mode13013012417.413012417.4
text-wrap-mode.nowrap13013012417.413012417.4
text-wrap-mode.wrap13013012417.413012417.4
text-wrap-style13013012417.513012417.5
text-wrap-style.auto13013012417.513012417.5
text-wrap-style.stable13013012417.513012417.5
text-wrap.nowrap11411412417.411412417.4
text-wrap.stable13013012117.513012117.5
text-wrap.wrap11411412417.411412417.4