html - 当内容很长时，表格中的可编辑 div 超出其百分比宽度

Question

我正在使用 Chrome。我在表格中有一个可编辑的 DIV，其宽度由百分比定​​义。它的 CSS 如下:

div#editable {
    width:20%;
    white-space:nowrap;    
    overflow:hidden;
    border:1px solid darkgrey;
}

当向 DIV 中添加很长的内容时，无论 CSS 定义如何，其宽度都会开始增加。这是一个演示链接:http://jsfiddle.net/k5Erc/ .您可以尝试向 DIV 中输入更多内容，并查看其宽度是否在增加。

但是，如果它的宽度定义为px或者em，就没有这个问题了。

谁能告诉我如何固定它的宽度？

Answer 1

如果你只希望你的文本换行，那么宽度保持不变你需要去掉 white-space:nowrap; 否则添加 table-layout:fixed; 到你的表 css

在这里查看更新的 fiddle http://jsfiddle.net/k5Erc/1/