टेबल-सेल वर्ड-रैप स्लैश के साथ काम नहीं कर रहा है

Question

मैं एक निश्चित लेआउट में टेक्स्ट लपेटने की कोशिश कर रहा हूं लेकिन टेक्स्ट में स्लेश होने पर यह काम नहीं करता है।

क्या यह जावास्क्रिप्ट (शुद्ध सीएसएस) से रिक्त स्थान डाले बिना तय किया जा सकता है?

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

"तालिका" div-तत्व को table-layout:fixed; जोड़ें और सेल के लिए एक चौड़ाई आवंटित यह लाइनों को तोड़ने बनाने के लिए:

JSFiddle

Answer 2

प्रत्येक ओ के बाद <wbr> टैग या शून्य-चौड़ाई वाली जगह ​ डालें एक स्लैश या अन्य चरित्र का ccurrence जिसे इसके बाद सीधी रेखा तोड़ने की अनुमति के रूप में माना जाना चाहिए। इन विकल्पों के बीच चुनाव थोड़ा complicated है, लेकिन चूंकि आपका कोड पहले से ही IE के पुराने संस्करणों पर काम करने में विफल रहता है, इसलिए आप उन्हें यहां भी अनदेखा कर सकते हैं, और इससे ​ सही विकल्प बन जाएगा। यही है, आप लिखेंगे उदा।

abfdbfdbfdb/​dfbfdbdfbfbf/​bdffbdbfdfbddfbdfbdfb 

समस्या चरित्र स्तर पर है, स्टाइल की बात नहीं है।

कोई स्ट्रिंग युक्त कोई स्ट्रिंग आमतौर पर लपेटने में अविभाज्य नहीं है और इस तरह से होना चाहिए, जब तक कि आप विश्वसनीय रूप से ब्राउज़र को स्वीकार्य ब्रेकिंग पॉइंट्स पर ब्रेक नहीं कर सकते या उचित रूप से हाइफ़नेट नहीं कर सकते और शब्द विभाजन का उपयोग नहीं कर सकते। word-wrap: break-word जैसी सेटिंग असाधारण मामलों के लिए है, आपातकालीन ब्रेक जब रैपिंग को नियंत्रित करने का कोई अच्छा तरीका नहीं है और ओवरफ्लो से बचने की आवश्यकता है।