texto fluindo de div

Quando o texto não tem espaços e tem mais do que o tamanho div de 200px, ele está fluindo A largura é definida como 200px. Coloquei meu código aqui http://jsfiddle.net/madhu131313/UJ6zG/ Você pode ver as fotos editadas abaixo : Eu quero o texto para ir para a próxima linha

É devido ao fato de você ter uma palavra longa sem espaços. Você pode usar a word-wrappropriedade para quebrar o texto:

#w74 { word-wrap: break-word; }

Ele também tem um suporte de navegador bastante bom. Veja a documentação sobre isso aqui .

Usar

white-space: pre-line;

Isso impedirá que o texto flua para fora do div. Isso quebrará o texto quando chegar ao final do div.

Você deve usar overflow:hidden; ouscroll

http://jsfiddle.net/UJ6zG/1/

ou com php você poderia encurtar as palavras longas ...

Você precisa aplicar a seguinte propriedade CSS ao bloco de contêiner (div):

overflow-wrap: break-word;

De acordo com as especificações (fonte CSS | MDN ):

A overflow-wrappropriedade CSS especifica se o navegador deve ou não inserir quebras de linha nas palavras para evitar que o texto transborde de sua caixa de conteúdo.

Com o valor definido para break-word

Para evitar o estouro, palavras normalmente inquebráveis ​​podem ser quebradas em pontos arbitrários se não houver pontos de quebra aceitáveis ​​na linha.

Vale a pena mencionar...

A propriedade era originalmente chamada de uma extensão não padrão e sem prefixo da Microsoft word-wrape foi implementada pela maioria dos navegadores com o mesmo nome. Desde então, foi renomeado para overflow-wrap, word-wrapsendo um alias.

Se você se preocupa com o suporte a navegadores legados, vale a pena especificar ambos:

word-wrap    : break-word;
overflow-wrap: break-word;

Ex. IE9 não reconhece, overflow-wrapmas funciona bem comword-wrap

use overflow:auto-o para dar uma rolagem ao seu texto dentro de div:).

Se isso ajudar. Adicione a seguinte propriedade com valor ao seu seletor:

white-space: pre-wrap;

Isso funcionou para mim:

{word-break: break-all; }

eu recentemente encontrei isso. Eu usei:display:block;

Se for apenas uma instância que precisa ser quebrada em 2 ou 3 linhas, eu usaria apenas algumas <wbr>na string. Ele os tratará exatamente como, <br>mas não inserirá a quebra de linha se não for necessário.

<div id="w74" class="dpinfo">
adsfadsadsads<wbr>fadsadsadsfadsadsa<wbr>dsfadsadsadsfadsadsads<wbr>fadsadsadsfadsadsadsfa<wbr>dsadsadsfadsadsadsfadsad<wbr>sadsfadsadsads<wbr>fadsadsadsfadsads adsfadsads
</div>

Aqui está um violino.

http://jsfiddle.net/gaby_de_wilde/UJ6zG/37/