tablo hücresi word-wrap eğik çizgi ile çalışmaz

Question

Metni sabit bir düzende sarmaya çalışıyorum ancak metin eğik çizgi içeriyorsa çalışmaz.

Bu, Javascript'ten (saf CSS) boşluk eklemeden düzeltilebilir mi?

jsfiddle:

http://jsfiddle.net/HgBhk/1/

Not working: 
<div style="display:table; width:170px; background-color:cyan;"> 
    <div style="display:table-row"> 
     <div style="display:table-cell;word-wrap: break-word;">abfdbfdbfdb/dfbfdbdfbfbf/bdffbdbfdfbddfbdfbdfb</div> 
     <div style="display:table-cell; width:34px; background-color:red;">xxxxx</div>   
    </div> 
</div> 

</br> 
Working: 
<div style="display:table; width:170px; background-color:cyan;"> 
    <div style="display:table-row"> 
     <div style="display:table-cell;word-wrap: break-word;">abfdbfdbfdb dfbfdbdfbfbf bdffbdbfdfbddfbdfbdfb</div> 
     <div style="display:table-cell; width:34px; background-color:red;">xxxxx</div>   
    </div> 
</div> 

Answer 1

"tablo" div-elemana table-layout:fixed; ekleyin ve hücreye bir genişliğe atamak o satırları kırmak yapmak için:

JSFiddle

Answer 2

Her 0'dan sonra bir <wbr> etiketi veya sıfır genişlikli boşluk ​'u ekleyin. Bir çizgi ya da başka bir karakterin kırılması, sonrasında direkt hat kesintisine izin vermesi gibi davranılmalıdır. Bu alternatifler arasındaki seçim biraz complicated'dur, ancak kodunuz zaten IE'nin eski sürümlerinde çalışmaz hale geldiğinden, onları da görmezden gelebilirsiniz ve bu da ​'u doğru seçim yapar. Yani, ör.

abfdbfdbfdb/​dfbfdbdfbfbf/​bdffbdbfdfbddfbdfbdfb 

Sorun, karakter düzeyinde değil, bir stil konusudur.

hiçbir boşluk karakterleri içeren bir dize ambalajda normalde bölünmez olduğunu ve güvenilir tarayıcılar yapmak ya kabul edilebilir kırılma noktalarında kırmak veya düzgün tirelenmez ve kullanım kelime bölme sürece, bu şekilde olmalıdır. word-wrap: break-word gibi bir ayar istisnai durumlar için, paketlemeyi kontrol etmek için iyi bir yol olmadığında ve taşmayı önlemek için bir ihtiyaç olduğunda acil molalar içindir.