white-space
Specifies how whitespace characters (spaces, tab characters, and line breaks) in text are displayed.
Sample Code
p.test { white-space: normal;}
p.test1 { white-space: pre;}
p.test2 { white-space: nowrap;}
Available Values
| Value | Description |
|---|---|
| normal | Consecutive spaces, tabs, and line breaks in the text are displayed as a single space. Text wraps automatically to fit the containing element's width. This 'normal' is the initial value. |
| pre | Spaces, tabs, and line breaks in the text are preserved and displayed as-is. |
| nowrap | Consecutive spaces, tabs, and line breaks in the text are displayed as a single space. Text does not wrap automatically. |
Browser Display Result
These samples use the following string:
This is a p element. Text. Text. Text. Text. Text.
<p style="border: solid 1px; white-space: normal; width: 200px;">This is a p element. Text. Text. Text. Text. Text.</p>
<p style="border: solid 1px; white-space: pre; width: 200px;">This is a p element. Text. Text. Text. Text. Text.</p>
<p style="border: solid 1px; white-space: nowrap; width: 200px;">This is a p element. Text. Text. Text. Text. Text.</p>
Browser Compatibility
Desktop
Supported in all versions
8 ○
7 ○
6 ○
3 and earlier ×Mobile
Android Browser
4.4+ ○
3 and earlier ×Same support as desktop
Same support as desktop
※ Version data is based on MDN.
If you find any errors or copyright issues, please contact us.