The overflow-wrap CSS property specifies whether or not the browser should insert line breaks within words to prevent text from overflowing its content box.

/* Keyword values */
overflow-wrap: normal;
overflow-wrap: break-word;

/* Global values */
overflow-wrap: inherit;
overflow-wrap: initial;
overflow-wrap: unset;

Note: In contrast to word-break, overflow-wrap will only create a break if an entire word cannot be placed on its own line without overflowing.

The property was originally a nonstandard and unprefixed Microsoft extension called word-wrap, and was implemented by most browsers with the same name. It has since been renamed to overflow-wrap, with word-wrap being an alias.

Initial valuenormal
Applies toall elements
Inheritedyes
Mediavisual
Computed valueas specified
Animation typediscrete
Canonical orderthe unique non-ambiguous order defined by the formal grammar

Syntax

The overflow-wrap property is specified as a single keyword chosen from the list of values below.

Values

normal
Lines may only break at normal word break points (such as a space between two words).
break-word
To prevent overflow, normally unbreakable words may be broken at arbitrary points if there are no otherwise acceptable break points in the line.

Formal syntax

normal | break-word

Examples

HTML

<p class="normal">FStrPrivFinÄndG (Gesetz zur Änderung des
  Fernstraßenbauprivatfinanzierungsgesetzes
  und straßenverkehrsrechtlicher Vorschriften)</p>
<p class="break-word">FStrPrivFinÄndG (Gesetz zur Änderung des
  Fernstraßenbauprivatfinanzierungsgesetzes
  und straßenverkehrsrechtlicher Vorschriften)</p>

CSS

.normal {
  width: 13em;
  background: gold;
}

.break-word {
  width: 13em;
  background: lime;
  overflow-wrap: break-word;
}

Result

Specifications

Specification Status Comment
CSS Text Module Level 3
The definition of 'overflow-wrap' in that specification.
Working Draft Initial definition

Browser compatibility

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support

Yes

11

No

Yes1

49

3.51

5.51

Yes

10.51

Yes

11

FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support

Yes

11

?

No

Yes1

49

41

Yes

Yes

11

?

1. Supported as word-wrap.

See also