在表单元格中打破长字与百分比宽度

Question

http://jsfiddle.net/L2yLe/

小提琴说了这一切.我想要一个仅限css的解决方案,将表格的宽度限制为div的宽度.应该打破长字符串(但正如您所看到的那样),这会导致表溢出.

我不想使用任何像素宽度.这应该是完全流动的.

<div>
<table>
    <tr>
        <td>
            short string
        </td>
        <td>
somereallylongstringofdatasomereallylongstringofdatasomereallylongstringofdata
        </td>
        <td>
            short string
        </td>
    </tr>
</table>
</div>

div {
    width: 50%;
    background-color: darkgray;
    padding: 15px;
    margin: 10px auto;
}
table {
    border-collapse: collapse;
}
td {
    border: 1px solid black;
}

Answer 1

伙计们看看http://blog.kenneth.io/blog/2012/03/04/word-wrapping-hypernation-using-css/

/* Warning: Needed for oldIE support, but words are broken up letter-by-letter */
   -ms-word-break: break-all;
   word-break: break-all;

   /* Non standard for webkit */
   word-break: break-word;

   -webkit-hyphens: auto;
   -moz-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;

Answer 2

写这个:

table {
border-collapse: collapse;
    table-layout: fixed;
    width:100%
}
td {
    border: 1px solid black;
    word-wrap:break-word;
}

检查一下:http://jsfiddle.net/L2yLe/7/