Propriedade word-wrap
Última atualização: 2026-09-13
word-wrap Propriedade word-wrap
A propriedade word-wrap do CSS é um alias para overflow-wrap. Ela controla se uma palavra longa ou URL pode quebrar internamente quando excede a largura do contêiner. Foi projetada para evitar que sequências longas indivisíveis transbordem o contêiner e segue sendo uma ferramenta comum para transbordamento de texto; as especificações modernas recomendam overflow-wrap.
| Categoria | |
|---|---|
| Valor Inicial | normal |
| Herdado | Sim |
| Aplica-se A | |
| Tipo de Animação | |
| Versão CSS | CSS3 |
| Status | Padrão |
📝 Sintaxe
word-wrap: normal | break-word;
⚙️ Valores
| Valor | Tipo | Descrição |
|---|---|---|
normal | break-word | Palavra-chave | Quebra de palavras longas (alias para overflow-wrap) |
▶ Exemplo
Edite o código abaixo e veja o resultado ao vivo no playground:
🌐 Suporte dos Navegadores
| Navegador | |||||
|---|---|---|---|---|---|
| word-wrap | ✓ v10 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v10 |
| Suportado em todos os principais navegadores | |||||
Dica: word-wrap: break-word prefere quebrar nas fronteiras das palavras e só quebra dentro de uma palavra quando uma única palavra excede a largura do contêiner.
Importante: word-wrap é o alias histórico de overflow-wrap e ambos são exatamente equivalentes. Projetos modernos devem usar overflow-wrap para seguir a especificação.
❓ Perguntas Frequentes
QExiste alguma diferença entre word-wrap e overflow-wrap?
ANenhuma — eles são totalmente equivalentes. word-wrap era o nome não padrão implementado pelos navegadores iniciais; mais tarde foi padronizado e renomeado para overflow-wrap, mas word-wrap foi mantido como um alias para compatibilidade.
QQual é a diferença entre word-wrap: break-word e word-break: break-all?
Aword-wrap: break-word mantém as palavras inteiras o máximo possível e só as quebra quando necessário; word-break: break-all força uma quebra na borda do contêiner, independentemente da integridade da palavra.
QComo lidar com URLs ou palavras longas que transbordam o contêiner?
AUse word-wrap: break-word (ou seja, overflow-wrap: break-word). O navegador prefere quebrar nas fronteiras das palavras e só quebra dentro de uma palavra quando uma única palavra longa não cabe — ideal para URLs, e-mails e sequências de hash.