Solution for word-break: break-all styling in firefox?

Question

I am trying to wrap text inside td and using the style below

word-break:break-all 

Works fine in IE, but doesn’t work in Firefox, read that it is not supported! tried the solution mentioned in http://petesbloggerama.blogspot.com/2007/02/firefox-ie-word-wrap-word-break-tables.html . Doesn't seem to work, any solution for this?

Thanks Adarsh

Answer 1

I also had problems with this. But I managed to get it to work:

 .hardBreak { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+, 6, 7, 8 compability-mode */ -ms-word-break: break-all; /* Internet Explorer 8 */ } 

Hope this helps.

The last parameter is required when using IE8 native mode. This works for me and is tested in FF8, IE 7, 8compability, 8native, Chrome.

Answer 2

Using word-wrap: break-word; It will definitely work!

Answer 3

FROM

display : block;

This is normal

Answer 4

word-wrap will only work for inline blocks or blocks. Therefore, you must change your element type. How:

 .example { display: inline-block; word-break: break-all; } 

Answer 5

I don’t think the solution you mentioned worked for a while; it may (inadvertently?) work on some previous versions of Firefox, but it does not look like the one you would expect to complete a task ( pre-wrap should not be expected to break words).

A way to force Firefox to treat the dot as a valid direct line break option is the <wbr> , but not in any specification, but widely supported. Usually it’s best to use it by inserting it at suitable points, but, in extreme cases, you can even put it between any two characters (presumably, you need to use preprocessing, server-side scripting or client-side JavaScript for this).

Answer 6

Try this instead:

 word-wrap:break-word 

It should work in all browsers (if you have a fixed width in the div / cell you apply it to ...