word-wrap:break-all not working as expected in IE

Question

Currently i am having issue the the word-wrap:break-all; in IE 11 ,IE 9 (tested) . word-wrap:break-all is working fine if paragraph contains lengthy words as in example http://jsfiddle.net/Midhun52/Jb26N/ .

<table style="width:40px" class="t">
    <tr>
        <td> </td>
        <td class="r">
            <div style="width:100%">
            <p>abcd abcd yyyyyyyyyyyyyyyyyyyyyyyyyy abcd
               </p>
            </div>

        </td>
    </tr>

</table>

But if the lengthy word is made up of characters such as ''' ,':' etc word-wrap:break-all is not working as in example http://jsfiddle.net/Midhun52/3Jyt4/ .

<table style="width:40px" class="t">
        <tr>
            <td> </td>
            <td class="r">
                <div style="width:100%">
                <p>abcd abcd yyyyyyyyyyyyyyyyyyyyyyyyyy ''''''''''''''''''''''''''''''''''''''''''''''abcd
                   </p>
                </div>

            </td>
        </tr>

    </table>

Please let me know what's the reason behind this? Any solution to this problem?

Answer 1

If you really want a string like '''''''''''''''''''''''''''''''''''''''''''''' to be breakable at any point, you need to insert (somehow, perhaps with JavaScript) a line break opportunity between any two characters there. This could be <wbr> or ​. Under normal conditions, a string of special characters may have some permissible break points.

Answer 2

I think it's because (according to the w3c) the break-all property should only break letters or numbers.