Word-wrap not working in Internet Explorer

Question

When I'm using word-wrap:break-word with Browser Mode: IE9 Compatibility View and Document Mode: IE7 standards its working perfectly fine. However when I change the Document Mode: IE9 standards, its not working. I've also tried using -ms-word-wrap:break-word however its giving me the same result.

Document Type Definition: DTD/xhtml1-transitional.dtd

Can anyone tell me why is it so and if there is any workaround to cope up with it ?

Sounds familiar. Might try some of these ideas: http://stackoverflow.com/questions/8394685/css-word-wrap-break-word-dont-work-on-ie9 http://stackoverflow.com/questions/13903590/word-wrap-break-word-not-working-in-ie9 — showdev, Apr 19 '13 at 06:54
Create a jsfiddle with an example of your code to see what you have done. Only giving us the doctype is not helping us to help you. — seemly, Apr 19 '13 at 07:39
@seemly Checkout the jsFiddle [here](http://jsfiddle.net/dShringi/d6VsD/5/). — dShringi, Apr 19 '13 at 08:09

btevfik · Accepted Answer · 2013-04-19T08:54:29.570

18

you need to have

table {
    width:100%;
    table-layout:fixed;
}

and put word-wrap in table,td,th not into span

http://jsfiddle.net/d6VsD/7/

edited Apr 19 '13 at 08:54

answered Apr 19 '13 at 08:43

btevfik

3,391
3
27
39

score 15 · Answer 2 · answered Aug 05 '13 at 12:09

15

applying word-wrap property to parent of the concerned element will resolved the problem in IE9.

answered Aug 05 '13 at 12:09

mukesh

151
1
3

Piyush Marvaniya · Answer 3 · 2013-12-05T12:25:02.797

9

try it this way

  .table tr td { 
               word-wrap: break-word;
               word-break: break-all;
               }

edited Dec 05 '13 at 12:25

answered Nov 29 '13 at 06:52

Piyush Marvaniya

2,496
2
16
28

score 8 · Answer 4 · answered Oct 17 '16 at 17:56

8

In my case, IE did not respect the word break style until I made the span render as inline-block.

.selector{
    display: inline-block;
    word-break: break-all;
    overflow-wrap: break-word; /* For other browsers*/
}

answered Oct 17 '16 at 17:56

DevOragz

131
1
6

score 3 · Answer 5 · edited Jul 07 '17 at 18:44

3

-ms-word-break: break-all;

works in > IE9

edited Jul 07 '17 at 18:44

Petter Friberg

21,252
9
60
109

answered Jul 07 '17 at 18:22

Anusha Medicherla

41
7

score 1 · Answer 6 · answered Aug 10 '15 at 16:07

1

Adding -ms-word-break: break-word; worked for me.

answered Aug 10 '15 at 16:07

frodo2975

10,340
3
34
41

score 0 · Answer 7 · answered Apr 19 '13 at 09:11

0

it should work, .your_class_name{word-break:break-word;}, i have tested it in ie7 - ie9 and it breaks the word...

answered Apr 19 '13 at 09:11

Jurijs Nesterovs

245
2
7

Word-wrap not working in Internet Explorer

7 Answers7

Linked