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定义的，就没有这个问题了。

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

score 1 · Accepted Answer

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

在此处查看更新的小提琴http://jsfiddle.net/k5Erc/1/

1 回答 1