teks mengalir keluar dari div

Ketika teks tanpa spasi dan lebih dari ukuran div 200px itu mengalir keluar Lebar didefinisikan sebagai 200px Saya telah meletakkan kode saya di sini http://jsfiddle.net/madhu131313/UJ6zG/ Anda dapat melihat gambar di bawah ini diedit : Saya ingin teks untuk pindah ke baris berikutnya

Itu karena Anda memiliki satu kata panjang tanpa spasi. Anda dapat menggunakan word-wrapproperti untuk menyebabkan teks rusak:

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

Ini memiliki dukungan browser yang cukup baik juga. Lihat dokumentasi tentang itu di sini .

Menggunakan

white-space: pre-line;

Ini akan mencegah teks mengalir keluar dari div. Ini akan merusak teks saat mencapai akhir div.

Anda harus menggunakan overflow:hidden; atauscroll

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

atau dengan php Anda bisa menyingkat kata-kata panjang ...

Anda perlu menerapkan properti CSS berikut ke blok penampung (div):

overflow-wrap: break-word;

Menurut spesifikasinya (sumber CSS | MDN ):

The overflow-wrapmenspesifikasikan properti CSS apakah browser harus memasukkan jeda baris dalam kata-kata untuk mencegah teks dari meluap kotak isinya.

Dengan nilai disetel ke break-word

Untuk mencegah overflow, kata-kata yang biasanya tidak dapat dipecahkan dapat rusak pada titik yang berubah-ubah jika tidak ada titik putus yang dapat diterima di baris tersebut.

Layak disebut...

Properti ini awalnya merupakan ekstensi Microsoft yang tidak standar dan tidak diperbaiki word-wrap, dan diterapkan oleh sebagian besar browser dengan nama yang sama. Sejak itu telah diganti namanya menjadi overflow-wrap, dengan word-wrapmenjadi alias.

Jika Anda peduli dengan dukungan browser lama, ada baiknya menentukan keduanya:

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

Ex. IE9 tidak mengenali overflow-wraptetapi berfungsi dengan baikword-wrap

menggunakannya overflow:autoakan memberikan penggulung untuk teks Anda dalam div:).

Jika ini membantu. Tambahkan properti berikut dengan nilai ke pemilih Anda:

white-space: pre-wrap;

Ini melakukan trik untuk saya:

{word-break: break-all; }

saya baru-baru ini mengalami ini. Saya menggunakan:display:block;

Jika itu hanya satu contoh yang perlu dibungkus di atas 2 atau 3 baris saya hanya akan menggunakan beberapa <wbr>dalam string. Ini akan memperlakukan mereka seperti <br>tetapi tidak akan memasukkan jeda baris jika tidak diperlukan.

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

Ini biola.

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