Mozilla's getting a new look. What do you think? https://mzl.la/brandsurvey

Summary

The word-break CSS property is used to specify whether to break lines within words.

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

Syntax

/* Keyword values */
word-break: normal; 
word-break: break-all; 
word-break: keep-all;

/* Global values */
word-break: inherit;
word-break: initial;
word-break: unset;

Values

normal
Use the default line break rule.
break-all
Word breaks may be inserted between any character for non-CJK (Chinese/Japanese/Korean) text.
keep-all
Don't allow word breaks for CJK text.  Non-CJK text behavior is the same as for normal.

Formal syntax

normal | break-all | keep-all

Examples

HTML Content

<p>1. <code>word-break: normal</code></p>
<p class="normal narrow"> This is a long and Supercalifragilisticexpialidocious sentence. 次の単語グレートブリテンおよび北アイルランド連合王国で本当に大きな言葉 </p> 

<p>2. <code>word-break: break-all</code></p>
<p class="breakAll narrow"> This is a long and Supercalifragilisticexpialidocious sentence. 次の単語グレートブリテンおよび北アイルランド連合王国で本当に大きな言葉 </p> 

<p>3. <code>word-break: keep-all</code></p>
<p class="keep narrow"> This is a long and Supercalifragilisticexpialidocious sentence. 次の単語グレートブリテンおよび北アイルランド連合王国で本当に大きな言葉</p>

CSS Content

.narrow {
    padding: 5px;
    border: 1px solid;
    width: 8em;
}

.normal {
    word-break: normal;
}

.breakAll {
    word-break: break-all;
}

.keep {
    word-break: keep-all;
}

Specifications

Specification Status Comment
CSS Text Level 3
The definition of 'word-break' in that specification.
Working Draft Initial definition

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 1.0 15.0 (15.0) 5.5[1] 15 (Yes)
keep-all 44 15.0 (15.0) 5.5 31 9
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support (Yes) 18.0 15.0 (15.0) ? No support ?
keep-all No support[2] No support[2] 15.0 (15.0) ? No support 9

[1] IE8 introduced -ms-word-break as a synonym for word-break. Don't use the -ms- prefix.

[2] See WebKit bug 123782.

See also

Document Tags and Contributors

 Last updated by: Sebastianz,