I am trying to wrap text in a fixed layout, but it does not work when the text contains slashes.
Can this be fixed without inserting spaces from Javascript (pure CSS)?
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>
source
share