Why doesn't my max-width html table cause text to wrap around?

Question

I have an html table, and one column (or <td> ) contains very long words. I want to set the maximum width of the column, so if the text is longer than the maximum width, the text should automatically wrap to the next line. I tried to set the css style max-width in the corresponding <td> element with "max-width:100px" , but it does not work. The text is still very long and does not automatically end on the next line.

Any ideas what is wrong or any solution reference code? I am using IE 8 on Windows 7.

Answer 1

You need to add the CSS3 property word-wrap: break-word; .

Answer 2

You can put a div inside your table cells.

Nothing inside this div will stretch the table cell.

Works great in IE8 and Chrome.

Answer 3

The old html td width will work in IE 8 for this ... But you need a maximum width, not a width ... besides the additional html attribute needed for each cell.

Answer 4

 <td nowrap="wrap" style="width:100px;"></td> 

All browsers ..

Unfortunately, you have to process the contents of each cell to maintain a fixed width for the entire table. There is a width attribute, but it does not control anything.