tekst wypływający z div

Kiedy tekst jest bez spacji i przekracza rozmiar div 200px , wypływa Szerokość jest zdefiniowana jako 200px Umieściłem tutaj mój kod http://jsfiddle.net/madhu131313/UJ6zG/ Możesz zobaczyć poniższe zdjęcia po edycji : Chcę tekst, aby przejść do następnego wiersza

Wynika to z faktu, że masz jedno długie słowo bez spacji. Możesz użyć tej word-wrapwłaściwości, aby spowodować przerwanie tekstu:

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

Ma też dość dobrą obsługę przeglądarki. Zobacz dokumentację na ten temat tutaj .

Posługiwać się

white-space: pre-line;

Zapobiegnie to wypłynięciu tekstu z div. Spowoduje to przerwanie tekstu, gdy dotrze do końca div.

Powinieneś użyć overflow:hidden; lubscroll

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

lub za pomocą php możesz skrócić długie słowa ...

Musisz zastosować następującą właściwość CSS do bloku kontenera (div):

overflow-wrap: break-word;

Zgodnie ze specyfikacją (źródło CSS | MDN ):

Właściwość overflow-wrapCSS określa, czy przeglądarka powinna wstawiać podziały wierszy w słowach, aby tekst nie przepełniał pola zawartości.

Z wartością ustawioną na break-word

Aby zapobiec przepełnieniu, zwykle nierozerwalne słowa mogą być łamane w dowolnych punktach, jeśli nie ma innych akceptowalnych punktów przerwania w linii.

Warty wspomnienia...

Ta właściwość była pierwotnie niestandardowym rozszerzeniem firmy Microsoft o nazwie bez prefiksu word-wrapi została zaimplementowana w większości przeglądarek o tej samej nazwie. Od tego czasu została zmieniona na overflow-wrap, ze word-wrapjest aliasem.

Jeśli zależy Ci na obsłudze starszych przeglądarek, warto określić oba:

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

Dawny. IE9 nie rozpoznaje, overflow-wrapale działa dobrze zword-wrap

użycie overflow:autogo spowoduje przewijanie tekstu w obrębie div:).

Jeśli to pomoże. Dodaj następującą właściwość z wartością do swojego selektora:

white-space: pre-wrap;

To załatwiło sprawę:

{word-break: break-all; }

Niedawno to spotkałem. Użyłem:display:block;

Jeśli jest to tylko jedna instancja, którą należy zawinąć w 2 lub 3 linie, użyłbym po prostu kilku <wbr>w ciągu. Potraktuje je tak samo, <br>ale nie wstawi końca wiersza, jeśli nie jest to konieczne.

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

Oto skrzypce.

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