white-space

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

* Some parts of this feature may have varying levels of support.

Resumo

A propriedade CSS white-space é usada para descrever como os espaços em branco dentro dos elementos são manipulados.

Initial valuenormal
Aplica-se aall elements
Inheritedyes
Computed valueas specified
Animation typediscrete

Sintaxe

Formal syntax: 
white-space = 
normal |
pre |
nowrap |
pre-wrap |
break-spaces |
pre-line

white-space: normal
white-space: nowrap
white-space: pre
white-space: pre-wrap
white-space: pre-line

white-space: inherit

Valores

normal

Sequências de espaços em branco são recolhidas. Caracteres de nova linha no código são tratados como outros espaços em branco. As linhas quebram conforme a necessidade para preencher as linhas das caixas (boxes).

nowrap

Recolhe os espaços em branco como no normal, mas suprime as quebras de linha (quebra de texto) no texto.

pre

Sequências de espaço em branco são preservadas, linhas são quebradas apenas em carateres de nova linha no código e em elementos <br>.

pre-wrap

Sequências de espaço em branco são preservadas. Linhas são quebradas em caracteres de nova linha, em <br> e quando necessário para preencher as linhas das caixas (boxes).

pre-line

Sequências de espaços em branco são recolhidas. Linhas são quebradas em caracteres de nova linha, em <br> e quando necessário para preencher as linhas das caixas (boxes).

A tabela a seguir resume o comportamento dos valores para white-space:

Novas linhas Espaços e Tabulações (tabs) Quebra de texto
normal Recolhido Recolhido Quebra
nowrap Recolhido Recolhido Sem quebra
pre Preservado Preservado Sem quebra
pre-wrap Preservado Preservado Quebra
pre-line Preservado Recolhido Quebra

Exemplos

css
code {
  white-space: pre;
}

Especificações

Specification
CSS Text Module Level 4
# white-space-property
Scalable Vector Graphics (SVG) 2
# TextWhiteSpace

Compatibilidade de Navegadores

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
white-space
break-spaces
normal
nowrap
pre
pre-line
pre-wrap
Accepts shorthand values
Experimental
On SVG elements
Support on <textarea>

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Partial support
Partial support
No support
No support
Experimental. Expect behavior to change in the future.
Requires a vendor prefix or different name for use.
Has more compatibility info.

[1] Internet Explorer 5.5+ suporta word-wrap: break-word; O código a seguir permite quebras de linhas dentro de elementos pre:

css
pre {
  word-wrap: break-word; /* IE 5.5-7 */
  white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */
  white-space: pre-wrap; /* current browsers */
}