Property Description
The word-wrap property allows long words to be able to be broken and wrap onto the next line.
This property has the following syntax:
word-wrap: normal|break-word|initial|inherit;
Property Values
| Value | Description |
|---|---|
| normal | (default) Break words only at allowed break points |
| break-word | Allows unbreakable words to be broken |
| initial | Specifies that the value of the property should be set to the default value |
| inherit | Specifies that the value of the property should be inherited from the parent element |
Examples
The following example shows the basic use of this property:
p.wrapit
{
width: 10em;
border: 1px solid #000000;
word-wrap: break-word;
}
<p class="wrapit">
veryveryveryveryveryveryveryveryverylongword</p>This produces the following result:
veryveryveryveryveryveryveryveryverylongword
Browser Support
| Chrome | Firefox | IE | Safari | Opera |
|---|---|---|---|---|
| 4.0 | 3.5 | 5.5 | 3.1 | 10.5 |
Miscellaneous Information
| Inherited: | Yes |
|---|---|
| Defined In: | CSS3 |
| Default Value: | normal |