Quebrar palavra com css

quebrar palavra com cssQuando determinamos a largura de uma DIV e o conteúdo desta DIV possuir uma palavra longa, esta  ultrapassa o limite da DIV. Este caso é visto mais frequente quanto temos o endereço de um site dentro de uma DIV que tem uma largura pequena.

Podemos fazer com esta palavra se quebre para se ajustar dentro da DIV. A solução é usar o atributo word-wrap.

O word-wrap, tem dois valores: normal ou break-word

O normal é o padrão default de um conteúdo dentro de uma DIV, as palavras não são cortadas.

Aqui está o conteúdo dentro da DIV que tem a largura de 200px. Agora aparecerá uma palavra grande para as dimensões desta DIV. DESINSTITUCIONALIZAÇÃO. Outro exemplo: http://www.lucianosimas.com.br

O valor break-word faz com que a palavra se quebre no limite da DIV e continua na linha de baixo, não ultrapassando assim o limite da largura da DIV.

<style type="text/css">
<!--

div{

width:200px;
word-wrap: break-word;
border:1px solid #000000;
}

-->
</style>
Aqui está o conteúdo dentro da DIV que tem a largura de 200px. Agora aparecerá uma palavra grande para as dimensões desta DIV. DESINSTITUCIONALIZAÇÃO. Outro exemplo: http://www.lucianosimas.com.br